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

时间:2010-07-28 12:36:28

标签: javascript dom

我有以下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以包含段落标记或删除空格。

2 个答案:

答案 0 :(得分:13)

不,insertBefore可以正常处理文本节点作为要插入的节点。问题是您之前尝试插入的节点不是您要插入的节点的子节点。您需要删除.parentNode位:

newParent.insertBefore(moveable, newParent.firstChild); 

答案 1 :(得分:2)

您需要从insert语句中删除“.parentNode”。文本节点仍然是一个节点,可以像其他每个节点一样被引用。