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 回答