从动态元素中删除onClick

时间:2016-09-09 20:36:00

标签: javascript html memory-leaks garbage-collection

我是否应该将动态clickHandler移除到动态创建的html标记中,还是由垃圾收集器自动处理。

我的主浏览器是Safari(嵌入在iOS应用程序中),但我想我读到IE有内存泄漏问题。

var li = document.createElement('li');
li.addEventListener('click', function(){});

所以如果以后从DOM中删除了这个元素,我应该删除clickHandler,以防万一我们知道如何删除clickHandler属性吗?

2 个答案:

答案 0 :(得分:0)

li.removeEventListener("click", function_name);

这将删除事件监听器

来源:http://www.w3schools.com/jsref/met_element_removeeventlistener.asp

对于匿名函数,它们的要点实际上是没有引用并且没有名称,因此对于removeEventListener(),您将需要一个命名函数。

答案 1 :(得分:0)

如果在删除元素后没有剩余的引用,GC应该清理它引用的处理函数。所以你不需要做任何事情。

但是如果IE有这样的bug,你可以使用removeEventListener删除处理程序,但是这需要你使用一个命名函数,因为你必须给removeEventListener提供相同的功能正如你在调用addEventListener时所做的那样,匿名函数永远不会彼此相同。

function myClickHandler {
    ...
}
var li = document.createElement('li');
li.addEventListener('click', myClickHandler);
...
li.removeEventListener('click', myClickHandler);
myClickHandler = null;
li.parentNode.removeChild(li);
需要

myClickHandler = null;,否则函数名称将保存对处理函数的引用,因此它不会被GCed。

如果您有多个LI,并且它们都使用相同的处理函数,则不必执行此操作。无论你拥有多少个LI,它们都只是指同一个函数,所以它不占用大量内存。