Rangy和InsertNode问题

Question

我正在选择一个单词，并尝试将其替换为元素结构。之前我使用的是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 );
}

new_update元素根本不是必需的，但它在此阶段有效。另外，我可以使用document.createDocumentFragment()而不是innerHTML吗？那么我该如何在该位置插入。

Answer 1

我假设getFirstRange()调用了rangy.getSelection().getRangeAt(0)

一个问题是，您的文本节点正在被下面的代码行清除，但是如果没有更多的内容(演示页面将是理想的)，就不可能说出主要的问题是什么。一种可能是deleteFromDocument()调用改变了range。我建议在插入节点之前从选择中获取一个新的范围：

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 );
}