Question

我的对象只有引用是它们所绑定的DOM元素，我不确定调用$element.remove()是否实际删除了引用或仅删除了DOM元素。这是一些示例代码。

var Foo = function() {
    var constructor = function Foo() {
        var col = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
        var $container = $('<div class="element" style="background-color:'+col+';"></div>');
        var $remove = $('<input type="button" value="Delete" />');
        $container.append($remove);
        $('#wrapper').append($container);

        $remove.on('click', function() {
            $container.remove();
        });
    };
    return constructor;
}();

$('#addElement').on('click', function() {
    new Foo();
});

还有jsfiddle供人们玩耍。点击一个按钮添加元素，点击每个元素＆＃34;删除＆＃34;按钮删除它;至少来自DOM。

对于我目前的项目而言，由于规模较小，这不一定是个问题，但我认为如果我曾经在做过大的工作，知道将来参考是非常有用的。

如果它没有，有没有办法删除对象而不将它们保存在某个数组中？

编辑：好的，所以我有点使用chrome堆快照回答了我自己的问题并向页面添加了10,000个元素。这是重要的数据。（我已经包含HTMLInputElements，因为我插入的大部分内容都是那些）

                Initial         10,000          Removed
Memory          2.7MB           135MB           4.0MB
Objects         1,676           81,693          11,703
InputElements   1               59,995          1

所以是的，似乎垃圾收集器足够聪明，可以在删除引用它们的DOM元素时删除对象。虽然它不完美。

Answer 1

只要您不再引用该对象，就会对对象进行垃圾回收。我不确定它是否会被视为“最佳实践”。来自MDN：

另一方面，当事物（对象，字符串等）被分配时，会分配JavaScript值在不再使用时创建并“自动”释放。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management

现代浏览器中上面描述的“自动”意味着被视为“无法访问”的对象将被标记为垃圾回收。

调用$ .element.remove（）只会删除DOM元素，因为它只知道DOM元素。它不可能删除与DOM元素关联的任何其他对象，因为它不知道该对象。

http://api.jquery.com/remove/

Javascript：使用jQuery.remove（）删除没有引用的显示对象

1 个答案: