javascript - 为什么不能在两个 dom 元素中附加同一个子元素？

Question

我只是注意到我做不到

var d1 = document.createElement('div');
var d2 = document.createElement('div');
var p = document.createElement('p');

d1.appendChild(p); // d1 has p now
d2.appendChild(p); // d2 has p now
// but where is p in d1 ?

有些人会说这是合乎逻辑的，但是，当我第一次注意到时，我觉得这有多么不酷。

为什么这不可能？

Answer 1

DOM是一个树结构。

当你附加一个元素时，你改变了它的父元素。

浏览器中的节点不仅仅是 P 中的文本(事实上，该字符串可以共享)。它还具有位置、尺寸、可见性、接收可能已在子元素中触发的事件、将事件传播到其父元素等。这里的一切都取决于树中的位置。就像许多 CSS 选择器一样。想象它在两个地方是同一个元素没有多大意义，最好把它想象成两个节点，也许有一些相同的内容。

如果你想在两个地方有相同的内容，你有to clone it .