最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

清空元素html("") innerHTML="" 与 empty()的区别和应用(推荐)

来源:懂视网 责编:小采 时间:2020-11-27 22:32:47
文档

清空元素html("") innerHTML="" 与 empty()的区别和应用(推荐)

清空元素html() innerHTML= 与 empty()的区别和应用(推荐):一、清空元素的区别 1、错误做法一: $(#test).html();//该做法会导致内存泄露 2、错误做法二: $(#test)[0].innerHTML=; ;//该做法会导致内存泄露 3、正确做法: //$(#test).empty(); 二、原理: 在 jQue
推荐度:
导读清空元素html() innerHTML= 与 empty()的区别和应用(推荐):一、清空元素的区别 1、错误做法一: $(#test).html();//该做法会导致内存泄露 2、错误做法二: $(#test)[0].innerHTML=; ;//该做法会导致内存泄露 3、正确做法: //$(#test).empty(); 二、原理: 在 jQue

一、清空元素的区别

     1、错误做法一:

           $("#test").html("");//该做法会导致内存泄露

     2、错误做法二:

           $("#test")[0].innerHTML="";  ;//该做法会导致内存泄露

     3、正确做法:

        //$("#test").empty();       

二、原理:

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

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

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

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

remove: function( selector ) { 
 if ( !selector || jQuery.filter( selector, [ this ] ).length ) { 
 // Prevent memory leaks 
 jQuery( "*", this ).add([this]).each(function(){ 
 jQuery.event.remove(this); 
 jQuery.removeData(this); 
 }); 
 if (this.parentNode) 
 this.parentNode.removeChild( this ); 
 } 
 }, 
 empty: function() { 
 // Remove element nodes and prevent memory leaks 
 jQuery(this).children().remove(); 
 
 // Remove any remaining nodes 
 while ( this.firstChild ) 
 this.removeChild( this.firstChild ); 
 }

 

文档

清空元素html("") innerHTML="" 与 empty()的区别和应用(推荐)

清空元素html() innerHTML= 与 empty()的区别和应用(推荐):一、清空元素的区别 1、错误做法一: $(#test).html();//该做法会导致内存泄露 2、错误做法二: $(#test)[0].innerHTML=; ;//该做法会导致内存泄露 3、正确做法: //$(#test).empty(); 二、原理: 在 jQue
推荐度:
标签: html inner innerhtml=
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top