Heim  >  Artikel  >  Web-Frontend  >  Lösung für jQuery-Speicherlecks

Lösung für jQuery-Speicherlecks

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

In diesem Artikel haben wir die jQuery-Speicherlecklösung als Referenz vorgestellt. Der spezifische Inhalt lautet wie folgt:

Idee: Erweitern Sie die Methode zum Löschen von jQuery-Elementobjekten für JQuery, wodurch der Druck erheblich verringert wird Speicherlecks

;(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);

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er zum Lernen aller beiträgt. Ich hoffe auch, dass jeder die PHP-Chinesisch-Website unterstützt.

Weitere Artikel zu jQuery-Speicherlecklösungen finden Sie auf der chinesischen PHP-Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn