如果一个DOM元素被移除,它的监听器也会从内存中移除吗?
当前回答
关于jQuery:
.remove()方法将元素从 DOM。当您想删除元素本身时,也可以使用.remove() 就像里面的一切一样。除了元素本身,所有 绑定事件和与元素关联的jQuery数据被移除。 要删除元素而不删除数据和事件,请使用.detach() 代替。
参考:http://api.jquery.com/remove/
jQuery v1.8.2 .remove()源代码:
remove: function( selector, keepData ) {
var elem,
i = 0;
for ( ; (elem = this[i]) != null; i++ ) {
if ( !selector || jQuery.filter( selector, [ elem ] ).length ) {
if ( !keepData && elem.nodeType === 1 ) {
jQuery.cleanData( elem.getElementsByTagName("*") );
jQuery.cleanData( [ elem ] );
}
if ( elem.parentNode ) {
elem.parentNode.removeChild( elem );
}
}
}
return this;
}
显然jQuery使用node.removeChild()
根据这个:https://developer.mozilla.org/en-US/docs/DOM/Node.removeChild,
被删除的子节点仍然存在于内存中,但不再是DOM的一部分。稍后,您可以通过oldChild对象引用在代码中重用已删除的节点。
Ie事件监听器可能被删除,但节点仍然存在于内存中。
其他回答
不要犹豫,观察堆以查看事件处理程序中内存泄漏,这些事件处理程序保留了对带有闭包的元素的引用,而元素保留了对事件处理程序的引用。
垃圾回收器不喜欢循环引用。
常见的内存泄漏情况: 承认一个对象有一个指向元素的引用。该元素有一个指向处理程序的引用。处理程序有一个指向对象的引用。 该对象引用了许多其他对象。此对象属于您认为已从集合中取消引用而丢弃的集合的一部分。 =>整个对象及其引用的所有内容将保留在内存中,直到页面退出。 =>,你必须为你的对象类考虑一个完整的杀死方法,或者信任MVC框架。
此外,不要犹豫使用Chrome开发工具的保留树部分。
关于jQuery:
.remove()方法将元素从 DOM。当您想删除元素本身时,也可以使用.remove() 就像里面的一切一样。除了元素本身,所有 绑定事件和与元素关联的jQuery数据被移除。 要删除元素而不删除数据和事件,请使用.detach() 代替。
参考:http://api.jquery.com/remove/
jQuery v1.8.2 .remove()源代码:
remove: function( selector, keepData ) {
var elem,
i = 0;
for ( ; (elem = this[i]) != null; i++ ) {
if ( !selector || jQuery.filter( selector, [ elem ] ).length ) {
if ( !keepData && elem.nodeType === 1 ) {
jQuery.cleanData( elem.getElementsByTagName("*") );
jQuery.cleanData( [ elem ] );
}
if ( elem.parentNode ) {
elem.parentNode.removeChild( elem );
}
}
}
return this;
}
显然jQuery使用node.removeChild()
根据这个:https://developer.mozilla.org/en-US/docs/DOM/Node.removeChild,
被删除的子节点仍然存在于内存中,但不再是DOM的一部分。稍后,您可以通过oldChild对象引用在代码中重用已删除的节点。
Ie事件监听器可能被删除,但节点仍然存在于内存中。
是的,垃圾收集器也会删除它们。不过,传统浏览器可能并不总是这样。
只是扩展其他答案……
在删除元素时,不会删除委托的事件处理程序。
$('body').on('click', '#someEl', function (event){
console.log(event);
});
$('#someEL').remove(); // removing the element from DOM
现在检查:
$._data(document.body, 'events');
对于jQuery,以下常用方法也将删除其他结构,如数据和事件处理程序:
remove ()
除了元素本身,所有与元素相关的绑定事件和jQuery数据都将被删除。
空()
为了避免内存泄漏,jQuery在删除元素本身之前先从子元素中删除其他构造,如数据和事件处理程序。
html ()
此外,jQuery在用新内容替换子元素之前,会从子元素中删除其他结构,如数据和事件处理程序。
推荐文章
- 如何在Java中监控计算机的CPU、内存和磁盘使用情况?
- 错误:'types'只能在.ts文件中使用- Visual Studio Code使用@ts-check
- React-Native:应用程序未注册错误
- LoDash:从对象属性数组中获取值数组
- src和dist文件夹的作用是什么?
- jQuery UI对话框-缺少关闭图标
- 在内存的哪里我的变量存储在C?
- 如何使用AngularJS获取url参数
- 将RGB转换为白色的RGBA
- 如何将“camelCase”转换为“Camel Case”?
- 我们可以在另一个JS文件中调用用一个JavaScript编写的函数吗?
- 如何使用JavaScript重新加载ReCaptcha ?
- jQuery。由于转义了JSON中的单引号,parseJSON抛出“无效JSON”错误
- 在JavaScript关联数组中动态创建键
- ReactJS和公共文件夹中的图像