Fatal编程技术网
  • javascript/
  • Javascript removeChild是递归的吗？

Javascript removeChild是递归的吗？

javascript dom

Javascript removeChild是递归的吗？,javascript,dom,Javascript,Dom,我使用document.createElement创建了许多新的页面元素（在一些任意层次结构中），并一直使用element.removeChild（）删除我不再需要的元素。我想知道这是否也能正确地清理所有的子元素，或者我是否应该使用某种递归函数。Javascript使用垃圾收集器，所以我不必担心这个问题，对吗？使用元素。removeChild（childElement）将从文档树中删除节点。但是，如果您有对该元素的引用，则该元素将不被垃圾收集（GC） 考虑： 示例1（可怕的做法）： 示例3（良好

我使用
document.createElement
创建了许多新的页面元素（在一些任意层次结构中），并一直使用
element.removeChild（）
删除我不再需要的元素。我想知道这是否也能正确地清理所有的子元素，或者我是否应该使用某种递归函数。Javascript使用垃圾收集器，所以我不必担心这个问题，对吗？

使用
元素。removeChild（childElement）
将从文档树中删除节点。但是，如果您有对该元素的引用，则该元素将不被垃圾收集（GC）

考虑：
示例1（可怕的做法）：

示例3（良好实践）：

不，你不应该，除非你用的是蹩脚的浏览器：-）有人吗？好的。我是否应该使用其他更合适的函数从DOM中删除整个节点？同样，没有-
元素。removeChild（）
也可以，除非您使用的是jQuery或其他库，但它们只包装本机JavaScript函数。这是JamWaffles引用的泄漏概述。据我所知，它只影响IE6。但你似乎在问两个不同的问题。removeChild是递归的吗？否，删除的节点保留其到其子节点的链接。你需要担心吗？不，如果你不再有对整棵树的引用，它会被垃圾收集。回答得好。关于第二个示例，大多数（如果不是全部的话）现代javascript引擎都有非常优化的GC，而您认为元素不是GC的原因正是因为您将
eval
放在了那里！也就是说，如果使用大型对象运行代码并删除
eval
语句并强制GC（例如，在shell中），您可以看到它们确实进行了清理，因为它们可以执行静态引用检查并得出不再需要保存这些对象的结论，即使传统的词汇作用域将它们定义为作用域链的一部分。我要说的是，在大多数现代浏览器中，第二个示例根本没有问题（假设您去掉
eval
）。 
<body><script>
var d = document.createElement("div");
document.body.appendChild(d);
document.body.removeChild(d);
//The global scope won't disappear. Therefore, the variable d will stay,
// which is a reference to DIV --> The DIV element won't be GC-ed
</script></body>

function foo(){
    var s = document.createElement("span");
    document.body.appendChild(s);
    s.innerHTML = "This could be a huge tree.";
    document.body.addEventListener("click", function(ev){
        alert(eval(prompt("s will still refer to the element:", "s")));
        //Use the provided eval to see that s and s.innerHTML still exist
        // Because this event listener is added in the same scope as where
        // DIV `d` is created.
    }, true);
    document.body.removeChild(s);
}
foo();

function main(){
    //Functions defined below
    addDOM();
    addEvent();
    remove();
    //Zero variables have been leaked to this scope.

    function addDOM(){
        var d = document.createElement("div");
        d.id = "doc-rob";
        document.body.appendChild(d);
    }
    function addEvent(){
        var e = document.getElementById("doc-rob");
        document.body.addEventListener("click", function(ev){
            e && alert(e.tagName);
            //Displays alert("DIV") if the element exists, else: nothing happens.
        });
    }
    function remove(){
        var f = document.getElementById("doc-rob");
        f.parentNode.removeChild(f);
        alert(f);//f is still defined in this scope
        Function("alert('Typeof f = ' + typeof f);")(); //alert("Typeof f = undefined")
    }
}
main();