2

我有一个按钮单击事件,它获取与选中的复选框关联的名称,并将它们添加到<ul>页面右侧的复选框中。这很好用,然后我有另一个按钮,<li>它将checkboxes<ul>. 这有效。当您重新添加已从右侧删除的项目时,问题就来了。该项目不在页面上,因此它显然已从 DOM 中删除,但就好像它仍然存储在浏览器内存中一样。我该如何从内存中清除它?代码如下。

$('.add-people').click(function () {
   $('.add-names:checked').each(function () {
      var name = $(this).parent().siblings('td.name-cell').html();
      if ($('ul.group-list').find(':contains(' + name + ')').length) {
         //Name is already in list
      } else {
         var newLi = '<li><input id="name" class="remove-names" type="checkbox" name="' + name + '"><span>' + name + '</span></li>'
         $('ul.group-list').append(newLi);                        
      }
   });
});

$('.remove-people').click(function () {
    $('.remove-names:checked').each(function () {
        $(this).parent().remove();
    });
});
4

1 回答 1

5

一旦一个 DOM 元素从 DOM 中移除,只有当 JavaScript 代码引用了该 DOM 元素时,它才会保持活动状态。如果没有对 DOM 元素本身的 javascript 引用,那么它将在下一次垃圾收集扫描期间被浏览器进行垃圾收集。

Areference in javascript表示保存 DOM 节点的 javascript 变量、数组、属性等。在您上面的代码中,我看不到任何持久的此类变量,因此我看不出为什么 DOM 节点不会从这段特定的代码中被垃圾收集。

为什么你认为它被存储在浏览器内存中?

要确保从内存中清除 DOM 元素,您需要做两件事:

  1. 从 DOM 中删除它。
  2. 通过将它们设置为 null 或任何其他值或确保它们超出范围以便变量本身被销毁(从而也释放它们的引用),确保没有 javascript 变量持有对它的引用。

就是这样,没有别的了。

于 2012-07-20T01:47:35.030 回答