jQuery内存泄露解决办法


Posted in Javascript onDecember 13, 2016

本文大家分享了jQuery内存泄露解决办法,供大家参考,具体内容如下

思路:为JQuery扩展删除jquery元素对象的方法,大大减轻内存泄露的压力

;(function($){
 if(!$.lui.widget) $.lui.widget = {};
 //$.lui.newGuid()生成随机32位id

 //如果采用此方式多次生成jquery对象的话,html代码字符串会在内存中多次重复,占用额外的内容,也会有泄露。而$("<span></span>").attr('id',_id)写法无此问题。

 $.lui.widget.__clean$ = $("<span id='" + $.lui.newGuid()+ "'></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);
  $('*',clearItem).each(function(i, e) {
  (events = $.data(this, 'events')) && $.each(events, function(i, e1) {
   $(e).unbind(i + '.*');
  });
  $.event.remove(this);
  $.removeData(this);
  });
  clearItem[0].innerHTML = '';
  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('id',_id).css({
    'position':'absolute',
    'top':'-1000px'
   }).appendTo('body');
   var _width = $tmpSpan.css({
    'font-family':$Element.css('font-family'),
    'font-size':$Element.css('font-size'),
    'letter-spacing':$Element.css('letter-spacing'),
    'word-spacing':$Element.css('word-spacing'),
    'text-indent':$Element.css('text-indent')
   }).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 '';
 if(str === undefined || typeof str != 'string') return '';
 if(limit === undefined) return str;
 if(!str || limit <=0 ) return '';
 var _str = new String(str);

 var _id = $.lui.newGuid();
 var $tmpSpan = $("<span></span>").attr('id',_id).css({
  'position':'absolute',
  'top':'-1000px'
 }).appendTo('body');
 var _width = $tmpSpan.css({
  'font-family':$Element.css('font-family'),
  'font-size':$Element.css('font-size'),
  'letter-spacing':$Element.css('letter-spacing'),
  'word-spacing':$Element.css('word-spacing'),
  'text-indent':$Element.css('text-indent')
 }).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);

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
服务器端的JavaScript脚本 Node.js 使用入门
Mar 07 Javascript
jquery中ajax函数执行顺序问题之如何设置同步
Feb 28 Javascript
js简单的弹出框有关闭按钮
May 05 Javascript
jquery根据属性和index来查找属性值并操作
Jul 25 Javascript
jQuery实现根据类型自动显示和隐藏表单
Mar 18 Javascript
基于JavaScript实现移动端点击图片查看大图点击大图隐藏
Nov 04 Javascript
基于JS实现类似支付宝支付密码输入框
Sep 02 Javascript
Canvas 制作动态进度加载水球详解及实例代码
Dec 09 Javascript
vue.js全局API之nextTick全面解析
Jul 07 Javascript
基于Vue制作组织架构树组件
Dec 06 Javascript
vue实现微信获取用户信息的方法
Mar 21 Javascript
javascript实现一款好看的秒表计时器
Sep 05 Javascript
Angular 常用指令实例总结整理
Dec 13 #Javascript
jQuery UI制作选项卡(tabs)
Dec 13 #Javascript
详解Bootstrap各式各样的按钮(推荐)
Dec 13 #Javascript
javascript动画系列之模拟滚动条
Dec 13 #Javascript
js闭包用法实例详解
Dec 13 #Javascript
深入学习Bootstrap表单
Dec 13 #Javascript
ThinkJS中如何使用MongoDB的CURD操作
Dec 13 #Javascript
You might like
咖啡的传说和历史
2021/03/03 新手入门
十天学会php之第七天
2006/10/09 PHP
php中计算时间差的几种方法
2009/12/31 PHP
浅析Dos下运行php.exe,出现没有找到php_mbstring.dll 错误的解决方法
2013/06/29 PHP
php使用mb_check_encoding检查字符串在指定的编码里是否有效
2013/11/07 PHP
php中的观察者模式简单实例
2015/01/20 PHP
简单的自定义php模板引擎
2016/08/26 PHP
PHP正则删除HTML代码中宽高样式的方法
2017/06/12 PHP
一些易混淆且不常用的属性,希望有用
2007/01/29 Javascript
javascript 匿名函数的理解(透彻版)
2010/01/28 Javascript
js随机生成字母数字组合的字符串 随机动画数字
2015/09/02 Javascript
快速学习jQuery插件 Form表单插件使用方法
2015/12/01 Javascript
jQuery使用cookie与json简单实现购物车功能
2016/04/15 Javascript
javascript实现秒表计时器的制作方法
2017/02/16 Javascript
JavaScript 高性能数组去重的方法
2018/09/20 Javascript
Vue-input框checkbox强制刷新问题
2019/04/18 Javascript
基于vue实现图片验证码倒计时60s功能
2019/12/10 Javascript
JS实现transform实现扇子效果
2020/01/17 Javascript
JavaScript 严格模式(use strict)用法实例分析
2020/03/04 Javascript
vue addRoutes路由动态加载操作
2020/08/04 Javascript
[02:50]2014DOTA2 TI预选赛预选赛 大神专访第一弹!
2014/05/21 DOTA
[38:23]完美世界DOTA2联赛循环赛 FTD vs PXG BO2第二场 11.01
2020/11/02 DOTA
Python内置函数delattr的具体用法
2017/11/23 Python
Python 3.8新特征之asyncio REPL
2019/05/28 Python
详解Python 最短匹配模式
2020/07/29 Python
在django中查询获取数据,get, filter,all(),values()操作
2020/08/09 Python
JavaScript+Canvas实现自定义画板的示例代码
2019/05/13 HTML / CSS
日本一家专门经营各种箱包的大型网站:Traveler Store
2016/08/03 全球购物
印度低票价航空公司:GoAir
2017/10/11 全球购物
印度购物网站:TATA CLiQ
2017/11/23 全球购物
Gina Bacconi官网:吉娜贝康尼连衣裙和礼服
2018/04/24 全球购物
行政人员岗位职责
2013/12/08 职场文书
大学军训感言800字
2014/02/27 职场文书
反腐倡廉标语
2014/06/24 职场文书
整改落实情况汇报材料
2014/10/29 职场文书
pandas中关于apply+lambda的应用
2022/02/28 Python