Dom Rangy和InsertNode问题

我正在选择一个单词并尝试用元素结构替换它。之前我使用的是

IE=EmulateIE7

，下面的代码正在运行。由于其他一些问题，我删除了Emulate IE7元，下面的insertNode停止工作

function updateNodeAtRange(text, frag) {
    var range = getFirstRange();
var htmlcontent='<span id="AuniqueId" class="style1">'+frag+'</span><span id="BuniqueId" class="style2">'+text+'</span>';
if (range) {
    rangy.getSelection().deleteFromDocument();
    var el = document.createElement("new_update");
    el.setAttribute( 'id', 'CuniqueId' );
    el.appendChild(document.createTextNode(text)); //Not sure if this is right
    el.innerHTML = htmlcontent;
    range.insertNode(el);
    rangy.getSelection().setSingleRange(range);
}
alert( document.getElementById('Filearea').innerHTML );
}

函数更新数据传输（文本，帧）{
var range=getFirstRange（）；
var htmlcontent=''+frag+''+text+''；
如果（范围）{
rangy.getSelection（）.deleteFromDocument（）；
var el=document.createElement（“新的_更新”）；
el.setAttribute（'id'，'CuniqueId'）；
el.appendChild（document.createTextNode（text））；//不确定这是否正确
el.innerHTML=htmlcontent；
range.insertNode（el）；
rangy.getSelection（）.setSingleRange（范围）；
}
警报（document.getElementById（'Filearea'）.innerHTML）；
}

---

新的_update元素完全不是必需的，但它在这个阶段起作用。我也可以使用

document.createDocumentFragment（）

，而不是

innerHTML

？。那么如何在该位置插入

我假设

getFirstRange（）

调用

rangy.getSelection（）.getRangeAt（0）

一个问题是，您的文本节点被下面的一行删除了，但是如果没有更多的内容（最好是演示页面），就不可能说出主要问题是什么。一种可能是

range

已被

deleteFromDocument（）

调用更改。我建议在插入节点之前从选择中获取新范围：

function updateNodeAtRange(text, frag) {
    var sel = rangy.getSelection();
    if (sel.rangeCount > 0) {
        var htmlcontent='<span id="AuniqueId" class="style1">'
            +frag+'</span><span id="BuniqueId" class="style2">'
            +text+'</span>';
        sel.deleteFromDocument();
        var el = document.createElement("new_update");
        el.setAttribute( 'id', 'CuniqueId' );
        el.innerHTML = htmlcontent;
        var range = sel.getRangeAt(0);
        range.insertNode(el);
        sel.setSingleRange(range);
    }
    alert( document.getElementById('Filearea').innerHTML );
}

函数更新数据传输（文本，帧）{
var sel=rangy.getSelection（）；
如果（选择范围计数>0）{
var htmlcontent=''
+frag+“”
+文本+“”；
sele.deleteFromDocument（）；
var el=document.createElement（“新的_更新”）；
el.setAttribute（'id'，'CuniqueId'）；
el.innerHTML=htmlcontent；
var范围=选择范围（0）；
range.insertNode（el）；
选择设置单公差（范围）；
}
警报（document.getElementById（'Filearea'）.innerHTML）；
}

我假设

getFirstRange（）

调用

rangy.getSelection（）.getRangeAt（0）

一个问题是，您的文本节点被下面的一行删除了，但是如果没有更多的内容（最好是演示页面），就不可能说出主要问题是什么。一种可能是

range

已被

deleteFromDocument（）

调用更改。我建议在插入节点之前从选择中获取新范围：

function updateNodeAtRange(text, frag) {
    var sel = rangy.getSelection();
    if (sel.rangeCount > 0) {
        var htmlcontent='<span id="AuniqueId" class="style1">'
            +frag+'</span><span id="BuniqueId" class="style2">'
            +text+'</span>';
        sel.deleteFromDocument();
        var el = document.createElement("new_update");
        el.setAttribute( 'id', 'CuniqueId' );
        el.innerHTML = htmlcontent;
        var range = sel.getRangeAt(0);
        range.insertNode(el);
        sel.setSingleRange(range);
    }
    alert( document.getElementById('Filearea').innerHTML );
}

函数更新数据传输（文本，帧）{
var sel=rangy.getSelection（）；
如果（选择范围计数>0）{
var htmlcontent=''
+frag+“”
+文本+“”；
sele.deleteFromDocument（）；
var el=document.createElement（“新的_更新”）；
el.setAttribute（'id'，'CuniqueId'）；
el.innerHTML=htmlcontent；
var范围=选择范围（0）；
range.insertNode（el）；
选择设置单公差（范围）；
}
警报（document.getElementById（'Filearea'）.innerHTML）；
}

I将

rangy.getSelection（）.deleteFromDocument（）更改为
range.deleteContents（）运行良好。我将
rangy.getSelection（）.deleteFromDocument（）
更改为
range.deleteContents（）并且它工作得很好。