当我将孩子从一个父母移动/复制到另一个孩子时，如何重新计算显示？

Question

我正在尝试将具有多个子节点的父A的图像拖放到父B，该父B最初是空的。我可以指定element.parent = document.getElementById（＆＃39; foo＆＃39;），但文档不会自然流动，就像我最初将元素放在foo下一样。

我目前正在解决这种行为，让JavaScript样式的父母表现得好像它包含了孩子和孩子一样，就好像它包含在父母中一样，但我想知道是否有＆＃ 39;更好的方法是将文档更新为看起来好像孩子被放置在目标父母而不是原始父母之下。

Answer 1

您没有正确移动DOM中的项目 - 当您正确移动它时，显示将自动更新。

您不能只设置.parent属性。首先，.parent甚至不是DOM元素的属性（它是.parentNode）。其次，它不是您可以直接设置的属性（根据DOM spec，它是只读属性）。相反，你需要这样做：

document.getElementById('foo').appendChild(element);

这会将其从当前所在的DOM位置中删除，并将其作为新父节点的最后一个子节点附加。如果要将其作为特定子项相对于现有子项（例如，作为第3个子节点或第1个子节点），则可以使用.insertBefore()而不是.appendChild()。

如果想要将节点复制到新位置而不是移动现有节点，则首先必须制作节点的副本（从头开始或使用.cloneNode()进行，然后将副本插入DOM以同样的方式。