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中将具有数字属性名的对象转换为数组
Mar 06 Javascript
JavaScript打开word文档的实现代码(c#)
Apr 16 Javascript
JS正则表达式验证数字代码
Jan 28 Javascript
调用DOM对象的focus使文本框获得焦点
Feb 19 Javascript
JS异步文件上传(兼容IE8+)
Apr 02 Javascript
Vue生命周期示例详解
Apr 12 Javascript
原生js二级联动效果
Jun 20 Javascript
微信公众号H5支付接口调用方法
Jan 10 Javascript
vue接入腾讯防水墙代码
May 07 Javascript
Layui tree 下拉菜单树的实例代码
Sep 21 Javascript
js实现登录拖拽窗口
Feb 10 Javascript
vue element实现表格合并行数据
Nov 30 Vue.js
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
zend optimizer在wamp的基础上安装图文教程
2013/10/26 PHP
Codeigniter框架的更新事务(transaction)BUG及解决方法
2014/07/25 PHP
PHP中使用socket方式GET、POST数据实例
2015/04/02 PHP
smarty模板判断数组为空的方法
2015/06/10 PHP
浏览器脚本兼容 文本框中,回车键触发事件的兼容
2010/06/21 Javascript
jquery对ajax的支持介绍
2013/12/10 Javascript
JavaScript移除数组内重复元素的方法
2015/03/18 Javascript
jquery分析文本里url或邮件地址为真实链接的方法
2015/06/20 Javascript
JS实现支持Ajax验证的表单插件
2016/03/24 Javascript
jQuery实现的多滑动门,多选项卡效果代码
2016/03/28 Javascript
基于JQuery的$.ajax方法进行异步请求导致页面闪烁的解决办法
2016/05/10 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
2016/09/17 Javascript
Node.js的Mongodb使用实例
2016/12/30 Javascript
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
2018/09/12 Javascript
解决vue keep-alive 数据更新的问题
2018/09/21 Javascript
nuxt配置通过指定IP和端口访问的实现
2020/01/08 Javascript
[04:48]DOTA2上海特锦赛小组赛第三日 TOP10精彩集锦
2016/02/28 DOTA
python二叉树遍历的实现方法
2013/11/21 Python
举例讲解Django中数据模型访问外键值的方法
2015/07/21 Python
Linux下python3.6.1环境配置教程
2018/09/26 Python
python的turtle库使用详解
2019/05/10 Python
python实现从本地摄像头和网络摄像头截取图片功能
2019/07/11 Python
Django接收post前端返回的json格式数据代码实现
2019/07/31 Python
wxpython绘制音频效果
2019/11/18 Python
Python爬虫实战案例之爬取喜马拉雅音频数据详解
2020/12/07 Python
python工具快速为音视频自动生成字幕(使用说明)
2021/01/27 Python
英国马莎百货印度官网:Marks & Spencer印度
2020/10/08 全球购物
同步和异步有何异同,在什么情况下分别使用他们
2013/04/09 面试题
安全生产目标责任书
2014/04/14 职场文书
贷款承诺书范文
2014/05/19 职场文书
养成教育经验材料
2014/05/26 职场文书
焦裕禄精神心得体会
2014/09/02 职场文书
教师个人师德工作总结2015
2015/05/12 职场文书
幼儿园教师教育随笔
2015/08/14 职场文书
企业法人任命书
2015/09/21 职场文书
奇妙的 CSS shapes(CSS图形)
2021/04/05 HTML / CSS