Home  >  Article  >  Web Front-end  >  jQuery memory leak solution

jQuery memory leak solution

高洛峰
高洛峰Original
2016-12-28 09:55:061305browse

In this article, we share the jQuery memory leak solution for your reference. The specific content is as follows

Idea: Extend the method of deleting jquery element objects for JQuery, greatly reducing the pressure of memory leaks

;(function($){
 if(!$.lui.widget) $.lui.widget = {};
 //$.lui.newGuid()生成随机32位id
 
 //如果采用此方式多次生成jquery对象的话,html代码字符串会在内存中多次重复,占用额外的内容,也会有泄露。而$("<span></span>").attr(&#39;id&#39;,_id)写法无此问题。
 
 $.lui.widget.__clean$ = $("<span id=&#39;" + $.lui.newGuid()+ "&#39;></span>");
 /**
 * 释放jquery对象,无返回值。此方法用以解决jquery的内存泄露问题
 */
 $.fn.del = function( selector, keepData ) {
 if ( !selector || $.filter( selector, [ this ] ).length ) {
  // 释放dom对象
  var item = $(this);
  var clearItem = $.lui.widget.__clean$;
  item.appendTo(clearItem);
  $(&#39;*&#39;,clearItem).each(function(i, e) {
  (events = $.data(this, &#39;events&#39;)) && $.each(events, function(i, e1) {
   $(e).unbind(i + &#39;.*&#39;);
  });
  $.event.remove(this);
  $.removeData(this);
  });
  clearItem[0].innerHTML = &#39;&#39;;
  item = null;
 }
 };
 
 /**
 * 计算字符串在某元素上不折行时的长度
 * @param {jQuery} $Element jquery元素
 * @param {String} str 字符串
 * @returns  {Number}  字符串长度(px)
 */
 $.lui.widget.clacStrLength = function($Element,str){
   var _id = $.lui.newGuid();
   var $tmpSpan = $("<span></span>").attr(&#39;id&#39;,_id).css({
    &#39;position&#39;:&#39;absolute&#39;,
    &#39;top&#39;:&#39;-1000px&#39;
   }).appendTo(&#39;body&#39;);
   var _width = $tmpSpan.css({
    &#39;font-family&#39;:$Element.css(&#39;font-family&#39;),
    &#39;font-size&#39;:$Element.css(&#39;font-size&#39;),
    &#39;letter-spacing&#39;:$Element.css(&#39;letter-spacing&#39;),
    &#39;word-spacing&#39;:$Element.css(&#39;word-spacing&#39;),
    &#39;text-indent&#39;:$Element.css(&#39;text-indent&#39;)
   }).text(str).innerWidth();
   $tmpSpan.del();
   $tmpSpan = null;
   return _width;
 };
 
 /**
 * 在某元素上按像素截取字符串 (采用浏览器默认处理空白方式,不适用于复杂场景,仅用于不换行情况下按像素截取字符串)
 * @param $Element jquery元素(该元素的字体设置必须已经确定)
 * @param str 字符串
 * @param limit  像素值
 * @returns 按像素截取后的字符串
 */
 $.lui.widget.substrByPx = function($Element,str,limit){
 if($Element === undefined || !$Element instanceof $) return &#39;&#39;;
 if(str === undefined || typeof str != &#39;string&#39;) return &#39;&#39;;
 if(limit === undefined) return str;
 if(!str || limit <=0 ) return &#39;&#39;;
 var _str = new String(str);
 
 var _id = $.lui.newGuid();
 var $tmpSpan = $("<span></span>").attr(&#39;id&#39;,_id).css({
  &#39;position&#39;:&#39;absolute&#39;,
  &#39;top&#39;:&#39;-1000px&#39;
 }).appendTo(&#39;body&#39;);
 var _width = $tmpSpan.css({
  &#39;font-family&#39;:$Element.css(&#39;font-family&#39;),
  &#39;font-size&#39;:$Element.css(&#39;font-size&#39;),
  &#39;letter-spacing&#39;:$Element.css(&#39;letter-spacing&#39;),
  &#39;word-spacing&#39;:$Element.css(&#39;word-spacing&#39;),
  &#39;text-indent&#39;:$Element.css(&#39;text-indent&#39;)
 }).text(str).innerWidth();
 while( _width >limit){
  _str = _str.substring(0, _str.length-1);
  _width = $tmp.text(_str).innerWidth();
 }
 $tmpSpan.del();
 $tmpSpan = null;
 return _str;
 }; 
})(jQuery);

The above is the entire content of this article. I hope it will be helpful to everyone's study. I also hope that everyone will support the PHP Chinese website.

For more articles related to jQuery memory leak solutions, please pay attention to the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn