jQuery数据缓存用法分析


Posted in Javascript onFebruary 20, 2015

本文分析了jQuery数据缓存用法。分享给大家供大家参考。具体如下:

在jQuery的API帮助文档中,jQuery这样描述数据缓存的作用:用于在一个元素上存取数据而避免了循环引用的风险。

一、定义缓存数据

使用$(selector).data(name,value)方法可以为jQuery对象定义缓存数据。这些缓存数据被存放在匹配的DOM元素集合中所有DOM元素中。

var $link = $('a');
$link.data('linkType', 'home');

说明:$(selector).data(name,value)可以在匹配的DOM元素上存放任何格式的数据,而不仅仅是字符串。

二、获取缓存数据

此时,只需要一个参数即可,该参数指定缓存数据的名称。

var linkType = $link.data('linkType'); //'home'

说明:如果读取的缓存数据不存在,则返回值为undefined;如果jQuery集合指向多个元素,则将只返回第一个元素的对应缓存数据。

三、删除缓存数据

removeData()函数能够删除指定名称的缓存数据,并返回对应的jQuery对象。

//删除缓存数据的同时,返回对应的jQuery对象。
var $a = $link.removeData('linkType');

四、jQuery数据缓存的使用规范

随着调用data()函数次数增多,或者因使用不当,会使得cache对象急剧膨胀,最终影响程序的性能。
所以在使用jQuery数据缓存功能时,应及时清理缓存对象。jQuery提供了removeData()函数手动清除缓存数据。根据jQuery框架的运行机制,下面几种情况不需要手动清除数据缓存。

* 对elem执行remove()操作,jQuery会自动清除对象可能存在的缓存。
* 对elem执行empty()操作,如果当前elem子元素存在数据缓存,jQuery也会清楚子对象可能存在的数据缓存。
* jQuery复制节点的clone()方法不会复制data缓存。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
js apply/call/caller/callee/bind使用方法与区别分析
Oct 28 Javascript
全面理解面向对象的 JavaScript(来自ibm)
Nov 10 Javascript
Jquery解析json数据详解
Dec 26 Javascript
jquery 字符串切割函数substring的用法说明
Feb 11 Javascript
推荐JavaScript实现继承的最佳方式
Nov 11 Javascript
JavaScript中window.showModalDialog()用法详解
Dec 18 Javascript
JavaScript中Cookie操作实例
Jan 09 Javascript
JavaScript取得WEB安全颜色列表的方法
Jul 14 Javascript
Node.js中使用jQuery的做法
Aug 17 Javascript
Three.js利用orbit controls插件(轨道控制)控制模型交互动作详解
Sep 25 Javascript
vue.js实现备忘录demo
Jun 26 Javascript
vue-element-admin 菜单标签失效的解决方式
Nov 12 Javascript
jQuery性能优化技巧分析
Feb 20 #Javascript
jQuery源码解读之removeClass()方法分析
Feb 20 #Javascript
jQuery源码解读之addClass()方法分析
Feb 20 #Javascript
jQuery源码解读之hasClass()方法分析
Feb 20 #Javascript
jQuery源码解读之removeAttr()方法分析
Feb 20 #Javascript
JS实现5秒钟自动封锁div层的方法
Feb 20 #Javascript
js实现感应鼠标图片透明度变化的方法
Feb 20 #Javascript
You might like
php设计模式 Adapter(适配器模式)
2011/06/26 PHP
深入探讨:PHP使用数据库永久连接方式操作MySQL的是与非
2013/06/05 PHP
php 获取页面中指定内容的实现类
2014/01/23 PHP
destoon实现不同会员组公司名称显示不同的颜色的方法
2014/08/22 PHP
详解PHP执行定时任务的实现思路
2015/12/21 PHP
Thinkphp事务操作实例(推荐)
2017/04/01 PHP
js展开闭合效果演示代码
2013/07/24 Javascript
Jquery的hover方法让鼠标经过li时背景变色
2013/09/06 Javascript
JS 毫秒转时间示例代码
2013/09/22 Javascript
jquery选择器之属性过滤选择器详解
2014/01/27 Javascript
javascript中2个感叹号的用法实例详解
2014/09/04 Javascript
node.js中的fs.mkdir方法使用说明
2014/12/17 Javascript
jQuery找出网页上最高元素的方法
2015/03/20 Javascript
配置Grunt的Task时通配符支持和动态生成文件名问题
2015/09/06 Javascript
AngularJS ng-bind-template 指令详解
2016/07/30 Javascript
基于JS实现类似支付宝支付密码输入框
2016/09/02 Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
2017/04/01 Javascript
微信小程序wepy框架笔记小结
2018/08/08 Javascript
浅谈微信页面入口文件被缓存解决方案
2018/09/29 Javascript
javascript实现函数柯里化与反柯里化过程解析
2019/10/08 Javascript
Vue数据双向绑定底层实现原理
2019/11/22 Javascript
[01:10]3.19DOTA2发布会 三代刀塔人第一代
2014/03/25 DOTA
python搭建简易服务器分析与实现
2012/12/15 Python
python基础教程之lambda表达式使用方法
2014/02/12 Python
Python 创建子进程模块subprocess详解
2015/04/08 Python
Django中传递参数到URLconf的视图函数中的方法
2015/07/18 Python
Tensorflow 利用tf.contrib.learn建立输入函数的方法
2018/02/08 Python
在PyCharm中三步完成PyPy解释器的配置的方法
2018/10/29 Python
python的内存管理和垃圾回收机制详解
2019/05/18 Python
美国网上花店:JustFlowers
2017/02/12 全球购物
劳资专员岗位职责
2013/12/27 职场文书
森林防火宣传标语
2014/06/27 职场文书
机关干部个人对照检查材料思想汇报
2014/09/28 职场文书
骨干教师个人总结
2015/02/11 职场文书
2015年财务人员工作总结
2015/04/10 职场文书
幼儿园奖惩制度范本
2015/08/05 职场文书