Question

while(i < check){
    randImage = retImgNodes();  //return image nodes
    div1.appendChild(randImage);  //append to div1
    console.log("appended div1");
    randImage2 = randImage;       //variable name is not a problem
    div2.appendChild(randImage2);
    console.log("appended div2");
    i++ ;
    //txt = document.createTextNode("hi")
    //div2.appendChild(txt);
}
theBody.appendChild(div1);
theBody.appendChild(div2);

Answer 1

按照设计，您无法在DOM中的多个位置放置单个元素。如果您尝试这样做，元素将从当前位置移动到您插入它的位置。

如果需要，可以使用cloneNode()创建节点的副本。然后，您可以将该副本插入到不同位置的DOM中。

您可能需要阅读documents，nodes和elements的文档。

例如appendChild() on MDN的文档说（强调我的）：

Node.appendChild（）方法将节点添加到指定父节点的子节点列表的末尾。 如果给定的子节点是对文档中现有节点的引用，则appendChild（）将其从当前位置移动到新位置（在附加之前不需要从其父节点中删除节点它到其他节点）。

这意味着节点不能同时位于文档的两个点。因此，如果节点已经有父节点，则首先删除该节点，然后将其附加到新位置。 Node.cloneNode()可用于制作节点的副本，然后将其附加到新父节点下。请注意，使用cloneNode创建的副本不会自动保持同步。

无法将相同的子项附加到由javascript创建的两个div元素

1 个答案: