jquery innerHTML 的清空注意事项

1.  $(function(){  
2.             $("#inner").click(function(){  
3.                 //错误，引起内存泄露  
4.                 $("#test")[0].innerHTML="";  
5.                   
6.                 //正确做法  
7.                 //$("#test").empty();  
8.             });  
9.               
10.         }); 
    

jquery 机制:

但是可以确定的是在 jquery 中用 innerHTML 的方法来清空元素，是必然会导致内存泄露的，由于 jquery 对于同一元素多事件处理没有直接采用浏览器事件模型，而是自己缓存事件，遍历触发，以及便于 trigger 程序触发 ：

1. // Init the element's event structure  
2.         var events = jQuery.data(elem, "events") || jQuery.data(elem, "events", {}),  
3.             handle = jQuery.data(elem, "handle") || jQuery.data(elem, "handle", function(){  
4.                 // Handle the second event of a trigger and when  
5.                 // an event is called after a page has unloaded  
6.                 return typeof jQuery !== "undefined" && !jQuery.event.triggered ?  
7.                     jQuery.event.handle.apply(arguments.callee.elem, arguments) :  
8.                     undefined;  
9.             }); 
   

采用 data 方法，将一些数据关联到了元素上面，上述事件即是采用该机制缓存事件监听器。

那么就可以知道，直接 innerHTML＝“” 而不通知 jquery 清空与将要删除元素关联的数据，那么这部分数据就再也释放不了了，即为内存泄露。

1. remove: function( selector ) {  
2.         if ( !selector || jQuery.filter( selector, [ this ] ).length ) {  
3.             // Prevent memory leaks  
4.             jQuery( "*", this ).add([this]).each(function(){  
5.                 jQuery.event.remove(this);  
6.                 jQuery.removeData(this);  
7.             });  
8.             if (this.parentNode)  
9.                 this.parentNode.removeChild( this );  
10.         }  
11.     },  
12.   
13.     empty: function() {  
14.         // Remove element nodes and prevent memory leaks  
15.         jQuery(this).children().remove();  
16.   
17.         // Remove any remaining nodes  
18.         while ( this.firstChild )  
19.             this.removeChild( this.firstChild );  
20.     } 
    

解决：

jquery 已经想到了这一方面，提供了 empty 函数，其思想就是，对节点的所有子，孙，重孙.....节点( $("*",this) )，先清空它们关联的数据，再进行节点的删除：