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 相关文章推荐
一个简单的jQuery插件制作 学习过程及实例
Apr 25 Javascript
原来Jquery.load的方法可以一直load下去
Mar 28 Javascript
跨域请求之jQuery的ajax jsonp的使用解惑
Oct 09 Javascript
JavaScript Scoping and Hoisting 翻译
Jul 03 Javascript
JavaScript对象属性检查、增加、删除、访问操作实例
Jul 08 Javascript
JavaScript获取function所有参数名的方法
Oct 30 Javascript
JS实现超简单的鼠标拖动效果
Nov 02 Javascript
Bootstrap自动适应PC、平板、手机的Bootstrap栅格系统
May 27 Javascript
js调用屏幕宽度的简单方法
Nov 14 Javascript
Angular.Js中ng-include指令的使用与实现
May 07 Javascript
layui弹出框Tab选项卡的示例代码
Sep 04 Javascript
微信小程序 冒泡事件原理解析
Sep 27 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
安装ImageMagick出现error while loading shared libraries的解决方法
2014/09/23 PHP
php获取根域名方法汇总
2014/10/28 PHP
php开发时容易忘记的一些技术细节
2016/02/03 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
js中巧用cssText属性批量操作样式
2011/03/13 Javascript
Jquery 动态生成表格示例代码
2013/12/24 Javascript
JS控制弹出新页面窗口位置和大小的方法
2015/03/02 Javascript
js由下向上不断上升冒气泡效果实例
2015/05/07 Javascript
jquery实现简单的自动播放幻灯片效果
2015/06/13 Javascript
JS+CSS实现滑动切换tab菜单效果
2015/08/25 Javascript
CSS或者JS实现鼠标悬停显示另一元素
2016/01/22 Javascript
javascript显示上周、上个月日期的处理方法
2016/02/03 Javascript
关于微信jssdk实现多图片上传的一点心得分享
2016/12/13 Javascript
ionic开发中点击input时键盘自动弹出
2016/12/23 Javascript
工厂模式在JS中的实践
2017/01/18 Javascript
详解单页面路由工程使用微信分享及二次分享解决方案
2019/02/22 Javascript
javascript数据类型中的一些小知识点(推荐)
2019/04/18 Javascript
小程序组件之自定义顶部导航实例
2019/06/12 Javascript
JS中的一些常用的函数式编程术语
2019/06/15 Javascript
nodejs+koa2 实现模仿springMVC框架
2020/10/21 NodeJs
Vue 解决在element中使用$notify在提示信息中换行问题
2020/11/11 Javascript
vue图片裁剪插件vue-cropper使用方法详解
2020/12/16 Vue.js
Pygame的程序开始示例代码
2020/05/07 Python
Python3+RIDE+RobotFramework自动化测试框架搭建过程详解
2020/09/23 Python
详解如何用HTML5 Canvas API控制图片的缩放变换
2016/03/22 HTML / CSS
HTML5添加禁止缩放功能
2017/11/03 HTML / CSS
Html5写一个简单的俄罗斯方块小游戏
2019/12/03 HTML / CSS
意大利奢侈品综合电商网站:MODES
2019/12/14 全球购物
计算机应用专业学生的自我评价分享
2013/11/03 职场文书
文明教师事迹材料
2014/01/16 职场文书
入党积极分子介绍信
2014/01/17 职场文书
中文专业学生自我评价范文
2014/02/06 职场文书
保安公司服务承诺书
2014/05/28 职场文书
2015新员工试用期工作总结
2014/12/12 职场文书
2016年“我们的节日·中秋节”活动总结
2016/04/05 职场文书
一文搞懂redux在react中的初步用法
2021/06/09 Javascript