如果 DOM 元素被移除，它的侦听器是否也从内存中移除? [英] If a DOM Element is removed, are its listeners also removed from memory?
问题描述
如果一个 DOM 元素被移除，它的监听器是否也从内存中移除?
If a DOM Element is removed, are its listeners removed from memory too?
推荐答案
现代浏览器
纯 JavaScript
如果被移除的 DOM 元素是无引用的(没有引用指向它)，那么 是 - 垃圾收集器以及任何关联的事件处理程序/侦听器会拾取该元素本身与它.
If a DOM element which is removed is reference-free (no references pointing to it) then yes - the element itself is picked up by the garbage collector as well as any event handlers/listeners associated with it.
var a = document.createElement('div');
var b = document.createElement('p');
// Add event listeners to b etc...
a.appendChild(b);
a.removeChild(b);
b = null;
// A reference to 'b' no longer exists
// Therefore the element and any event listeners attached to it are removed.
然而；如果仍有指向该元素的引用，则该元素及其事件侦听器将保留在内存中.
However; if there are references that still point to said element, the element and its event listeners are retained in memory.
var a = document.createElement('div');
var b = document.createElement('p');
// Add event listeners to b etc...
a.appendChild(b);
a.removeChild(b);
// A reference to 'b' still exists
// Therefore the element and any associated event listeners are still retained.
jQuery
可以公平地假设 jQuery 中的相关方法(例如 remove())将以完全相同的方式运行(考虑到 remove() 被编写例如使用 removeChild()).
It would be fair to assume that the relevant methods in jQuery (such as remove()) would function in the exact same way (considering remove() was written using removeChild() for example).
然而，这不是真的；jQuery 库实际上有一个名为 cleanData() (这是这个方法的样子)，它会在从 DOM 中删除时自动清除与元素关联的所有数据/事件(例如通过.remove(), empty(), html("") 等).
However, this isn't true; the jQuery library actually has an internal method (which is undocumented and in theory could be changed at any time) called cleanData() (here is what this method looks like) which automatically cleans up all the data/events associated with an element upon removal from the DOM (be this via. remove(), empty(), html("") etc).
较旧的浏览器 - 特别是旧版本的 IE - 已知存在内存泄漏问题，因为事件侦听器保持对它们所附加到的元素的引用.
Older browsers - specifically older versions of IE - are known to have memory leak issues due to event listeners keeping hold of references to the elements they were attached to.
如果您想更深入地了解用于修复旧版 IE 版本内存泄漏的原因、模式和解决方案，我完全建议您阅读 这篇关于理解和解决 Internet Explorer 泄漏模式的 MSDN 文章.
If you want a more in-depth explanation of the causes, patterns and solutions used to fix legacy IE version memory leaks, I fully recommend you read this MSDN article on Understanding and Solving Internet Explorer Leak Patterns.
还有几篇与此相关的文章:
A few more articles relevant to this:
在这种情况下，您自己手动删除侦听器可能是一个好习惯(仅当内存对您的应用程序如此重要并且您实际上是针对此类浏览器时).
Manually removing the listeners yourself would probably be a good habit to get into in this case (only if the memory is that vital to your application and you are actually targeting such browsers).
这篇关于如果 DOM 元素被移除，它的侦听器是否也从内存中移除?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
