removeChild

removeChild() 方法从子节点列表中删除某个节点。如删除成功，此方法可返回被删除的节点，如失败，则返回 NULL。

如果删除的节点还被引用，则还会占用内存，可以以后被操作，只是暂时被从Dom树中移除。如果不被引用则不会占用内存？ 

来个例子：

 

<div id="level_1">
    <button οnclick="addNode()">addNode</button>
    <button οnclick="removeNode()">removeNode</button>
    <div id="level_2">

    </div>
</div>

var addNode = function () {
    if(!document.getElementById("level_2")){
        var level2Node = document.createElement("div");
        level2Node.id="level_2";
        document.getElementById("level_1").appendChild(level2Node);
    }
    for(var i=0; i<1000; i++){
        var newNode = document.createElement("div");
        newNode.id="newNode_" + i;
        newNode.innerHTML = "test node";
        document.getElementById("level_2").appendChild(newNode);
    }
};

var deletedNode;
var removeNode = function () {
    var self = document.getElementById("level_2");
    if(self){
        deletedNode = self.parentNode.removeChild(self);
        //var deletedNode = self.parentNode.removeChild(self);
    }
};

 

怎么不能贴图片呢

 

从DevTool的memory面板中拍个照，可以看到 Detached HTMLDivElement