11

removeChild函数真的会完全删除子节点吗？或者它只是删除作为指定父节点的子元素的元素？如果它没有真正删除元素，有没有办法完全删除元素？

4

4 回答 4

18

该removeChild方法只是将其从其父级中删除。如果它是页面的可见元素，它将从页面中删除。

但是Javascript有垃圾收集。这意味着只要有任何变量引用它，节点对象本身就会一直存在。因此，您可以将节点分配给变量，用于removeChild从其父节点“修剪”它，然后将其插入或附加到其他节点，从而有效地在页面上移动它。

以下代码将删除一个节点，并等待 10 秒，然后再将其重新添加到树中（因此也添加到页面中）：

var oldNode = someNode.removeChild(...);
setTimeout(function () {
  document.documentElement.appendChild(oldNode);
}, 10000);

这意味着节点对象还没有从内存中删除，因为仍然有一个变量指向它（即oldNode）。

另一个案例：

var node = document.getElementById('test');
// ... do stuff
node.parentElement.removeChild(node);
// 'node' still exists, but has been removed from the page
// ... do some more stuff
node = document.getElementById('hello');
// The variable 'node' now points to something else; 
//  this means the original node will be deleted from memory

另一方面，如果您不将删除的节点重新分配给另一个变量，则无法再访问它（不是通过文档树，因为它已从那里删除；而不是通过 JS 变量）；所以Javascript会自动从内存中清除它：

someNode.removeChild(...);

将删除的节点分配给一个变量，然后将null（或其他任何东西）分配给该变量——就像 Marc B 在他的回答中所建议的那样——完全没有必要，而且恕我直言，这很愚蠢。

于 2011-03-04T15:04:58.353 回答
11

这将完全删除节点：

someNode.removeChild(...);

这将从 DOM 中删除节点，使其不可见，但会保存它，以便您可以将其插入其他地方：

oldNode = someNode.removeChild(...);
于 2011-03-04T14:32:00.450 回答
1

removeChild 从 dom 中移除元素，但它也会从函数中返回，以防您正在移除以将其重新插入其他地方。您必须杀死该返回值才能真正摆脱已删除的节点：

oldNode = someNode.removeChild(...);
oldNode = null;
于 2011-03-04T14:22:22.997 回答
1

如果你想真正删除一个 dom 元素。单独的 removeChild 是不够的。这是 YSlow 的作者 Steve Sounders 所说的。您需要使用删除

于 2011-11-09T05:31:17.957 回答