Imagine:
<div id="old-parent">
<span>Foo</span>
<b>Bar</b>
Hello World
</div>
<div id="new-parent"></div>
可以编写什么 JavaScript 来移动所有子节点(元素和文本节点)old-parent
to new-parent
没有 jQuery?
我不关心节点之间的空白,尽管我希望捕获杂散Hello World
,它们也需要按原样迁移。
EDIT
明确地说,我想最终得到:
<div id="old-parent"></div>
<div id="new-parent">
<span>Foo</span>
<b>Bar</b>
Hello World
</div>
提议重复的问题的答案将导致:
<div id="new-parent">
<div id="old-parent">
<span>Foo</span>
<b>Bar</b>
Hello World
</div>
</div>
基本上,您希望循环遍历旧父节点的每个直系后代,并将其移动到新父节点。任何直系后裔的孩子都会随之感动。
var newParent = document.getElementById('new-parent');
var oldParent = document.getElementById('old-parent');
function move() {
while (oldParent.childNodes.length > 0) {
newParent.appendChild(oldParent.childNodes[0]);
}
}
#old-parent {
background-color: red;
}
#new-parent {
background-color: green;
}
<div id="old-parent">
<span>Foo</span>
<b>Bar</b> Hello World
</div>
<div id="new-parent"></div>
<br>
<button onclick="move()" id="button">Move childs</button>
外部链接
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)