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动态设置样式实现代码(2)
Jan 25 Javascript
jquery 简单应用示例总结
Aug 09 Javascript
Jquery自定义button按钮的几种方法
Jun 11 Javascript
一款由jquery实现的整屏切换特效
Sep 15 Javascript
Angular ng-repeat指令实例以及扩展部分
Dec 26 Javascript
详解vue.js移动端导航navigationbar的封装
Jul 05 Javascript
Vue 使用formData方式向后台发送数据的实现
Apr 14 Javascript
Angular请求防抖处理第一次请求失效问题
May 17 Javascript
jQuery实现动态加载(按需加载)javascript文件的方法分析
May 31 jQuery
JavaScript实现移动端弹窗后禁止滚动
May 25 Javascript
vue输入框使用模糊搜索功能的实现代码
May 26 Javascript
原生js实现下拉框选择组件
Jan 20 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
php5 图片验证码实现代码
2009/12/11 PHP
图解找出PHP配置文件php.ini的路径的方法
2014/08/20 PHP
php实现常见图片格式的水印和缩略图制作(面向对象)
2016/06/15 PHP
php cookie 详解使用实例
2016/11/03 PHP
win7 wamp 64位 php环境开启curl服务遇到的问题及解决方法
2018/09/16 PHP
php引用和拷贝的区别知识点总结
2019/09/23 PHP
使用javascript访问XML数据的实例
2006/12/27 Javascript
Prototype Class对象学习
2009/07/19 Javascript
javascript下利用arguments实现string.format函数
2010/08/24 Javascript
20款超赞的jQuery插件 Web开发人员必备
2011/02/26 Javascript
Bootstrap轮播加上css3动画,炫酷到底!
2015/12/22 Javascript
AngularJS中使用HTML5手机摄像头拍照
2016/02/22 Javascript
利用jQuery中的ajax分页实现代码
2016/02/25 Javascript
JS使用单链表统计英语单词出现次数
2016/06/16 Javascript
AngularJS实现星星等级评分功能
2016/09/24 Javascript
JS实现图片放大缩小的方法
2017/02/15 Javascript
微信小程序实现打开内置地图功能【附源码下载】
2017/12/07 Javascript
vue 自定义提示框(Toast)组件的实现代码
2018/08/17 Javascript
Vue中android4.4不兼容问题的解决方法
2018/09/04 Javascript
在vue中读取本地Json文件的方法
2018/09/06 Javascript
Layui事件监听的实现(表单和数据表格)
2019/10/17 Javascript
nuxt.js添加环境变量,区分项目打包环境操作
2020/11/06 Javascript
Javascript节流函数throttle和防抖函数debounce
2020/12/03 Javascript
Python字符串特性及常用字符串方法的简单笔记
2016/01/04 Python
Python竟能画这么漂亮的花,帅呆了(代码分享)
2017/11/15 Python
Python3爬虫学习入门教程
2018/12/11 Python
python 使用matplotlib 实现从文件中读取x,y坐标的可视化方法
2019/07/04 Python
python分割一个文本为多个文本的方法
2019/07/22 Python
pycharm编写spark程序,导入pyspark包的3中实现方法
2019/08/02 Python
Python检查图片是否损坏及图片类型是否正确过程详解
2019/09/30 Python
python 动态绘制爱心的示例
2020/09/27 Python
美国婚礼礼品网站:MyWeddingFavors
2018/09/26 全球购物
槐乡的孩子教学反思
2014/04/27 职场文书
运动会宣传口号
2014/06/09 职场文书
“5.12”护士节主持词
2015/07/04 职场文书
vue 数字翻牌器动态加载数据
2022/04/20 Vue.js