我有以下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以包含段落标记或删除空格。
答案 0 :(得分:13)
不,insertBefore
可以正常处理文本节点作为要插入的节点。问题是您之前尝试插入的节点不是您要插入的节点的子节点。您需要删除.parentNode
位:
newParent.insertBefore(moveable, newParent.firstChild);
答案 1 :(得分:2)
您需要从insert语句中删除“.parentNode”。文本节点仍然是一个节点,可以像其他每个节点一样被引用。