想象一下:
<div id="old-parent">
<span>Foo</span>
<b>Bar</b>
Hello World
</div>
<div id="new-parent"></div>
可以编写什么JavaScript来将所有子节点(包括元素和文本节点)从old-parent
移动到new-parent
而不使用jQuery?
我不关心节点之间的空白,虽然我希望捕获杂散的Hello World
,但它们也需要按原样迁移。
编辑
为了明确起见,我想以如下方式结束:
<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>
5条答案
按热度按时间az31mfrm1#
基本上,您需要遍历旧父节点的每个直接后代,并将其移动到新父节点,直接后代的任何子节点都将随之移动。
External link
uqcuzwp82#
现代方式:
.append
是.appendChild
的替代品,主要区别在于它一次接受多个节点,甚至接受普通字符串,如.append('hello!')
oldParent.childNodes
是 * 可迭代的 *,因此它可以与...
一起展开,以变成.append()
的多个参数除了IE浏览器,其他浏览器都支持它。
tjrkku2a3#
下面是一个简单的函数:
el
的childNodes
是要移动的元素,newParent
是el
要移动到的**元素,**因此您将执行如下函数:**一个
qhhrdooz4#
这是一个简单的解决方案-切换节点id并改变它们的顺序。如果你不在id的名称中使用
-
,你可以这样做bvuwiixz5#
只有在除了将内部代码(innerHTML)从一个代码转移到另一个代码之外不需要做任何事情的情况下,这个答案才真正有效:
希望这有帮助!