Question

我一直在Javascript中处理一些内存泄漏问题。我已经到了一个点，我觉得至少一些泄漏的唯一解决方案是删除一个给定的div，然后删除所有的后代。意思是孩子，孙子等等。

现在我的印象是，如果我想这样做，我需要一个递归函数，但我仍然对Javascript有些新意。我甚至不知道递归在Javascript中是否与我习惯的方式相同。

我对如何做这样的事情有任何想法，也许我对递归的想法不太了解。

Answer 1

这会迅速破坏节点及其所有子节点：

var _dummyNode;
var destroy = function(node){
   if(!_dummyNode) _dummyNode = document.createElement('div');
   _dummyNode.appendChild(node.parentNode.removeChild(node));
   _dummyNode.innerHTML = "";
}
destroy(nodeToDestroy);

它会创建一个永远不会附加到文档的虚拟DIV，因此不会显示。节点将从其父节点中删除并附加到虚拟节点。然后用innerHTML消灭它。

但是 - 如果您仍然拥有对节点的变量引用，则会失败。您应该使用一个好的Ajax库，并且只使用适当的addEventListener来附加事件。你不应该这样做：

<div onclick="myFunction();">click me</div>

因为它不是一个很好的分离关注，它很难维护，它没有正确传递事件，你只能附加一个方法。如果你这样做，你基本上需要自己做垃圾收集。

Answer 2

我不知道我是否完全理解你想要的最终结果，但是将div的innerHTML设置为空白屏幕有效地摆脱了所有子节点：

document.getElementById('test').innerHTML = '';

Answer 3

您可以执行以下操作：

function removeChildren(elem){
    for(var i in elem.children){
        removeChildren(elem.children[i])
        elem.removeChild(elem.children[i])
    }
}
OR
function removeChildren(elem){
    while (elem.hasChildNodes()) {
        removeChildren(elem.lastChild)
        elem.removeChild(elem.lastChild);
    }
}

后一种选择可能更好。

Javascript删除div /节点的所有后代

3 个答案: