javascript - Javascript 将片段附加到现有的 HTML 元素

Question

我创建了一个 DOM 片段，我在其中循环添加了几个 childNode：

fragment.appendChild( clone )

我想获取这个片段并用它来替换已经包含这些节点的现有 HTML 元素。

我可以用

myContainer.appendChild(fragment)

然而，这也是在循环中完成的，并且片段被附加了太多次。如何获取片段，将其附加到 myContainer 并删除 myContainer 的旧子项。

谢谢你。

Answer 1

你可能想要：

while (myContainer.childNodes.length > 0) {
    myContainer.removeChild(myContainer.childNodes[0]);
}

myContainer.appendChild(fragment);

Answer 2

循环完成后你不能附加片段吗？

至于删除当前的子节点，您可以循环遍历它们并使用 removeChild 函数，或者您可以将元素的 innerHTML 设置为空字符串。如果在附加片段之前重置 innerHTML 应该没问题。

myContainer.innerHTML = "";
myContainer.appendChild(fragment);

Answer 3

如果我理解正确，您正在创建一个带有一些子节点的新节点，并且您希望这个新节点替换页面中的现有节点。

您可以：

• 删除现有节点的所有子节点，并将新子节点添加到现有节点
• 将所有子节点添加到另一个节点（我认为这就是您正在做的事情：添加到fragment），然后删除现有节点，并将节点添加到该位置。

请参阅removeChild和appendChild