使用JavaScript insertBefore()在TextNode之前插入？

Question

我有以下HTML:

<div id="move-me">
    <a href="#">I'm a link</a>
</div>

<div id="new-parent">
    Some plain text.
</div>

我正在尝试编写JavaScript,将整个#move-me div移到文本上方的#new-parent div中,如下所示:

<div id="new-parent">
    <div id="move-me">
        <a href="#">I'm a link</a>
    </div>
    Some plain text.
</div>

这是我的JavaScript:

function moveDiv() {
    var moveable = document.getElementById('move-me');
    var newParent = document.getElementById('new-parent');
    newParent.parentNode.insertBefore(moveable, newParent.firstChild);
}

我正在使用Firebug进行调试,我可以看到它newParent.firstChild是一个TextNode,但我总是收到以下错误:

Node was not found" code: "8
newParent.parentNode.insertBefore(moveable, newParent.firstChild); 

它似乎insertBefore需要一个元素节点,不能在文本节点上工作......是吗？如果是这样,还有另一个好方法吗？

注意:我无法修改或清理HTML以包含段落标记或删除空格.

Answer 1

不,insertBefore可以使用文本节点作为之前插入的节点.问题是您之前尝试插入的节点不是您要插入的节点的子节点.您需要删除该.parentNode位:

newParent.insertBefore(moveable, newParent.firstChild);