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 相关文章推荐
封装的原生javascript弹出层代码
Sep 24 Javascript
jquery load()在firefox(火狐)下显示不正常的解决方法
Apr 05 Javascript
JavaScript获取当前页面上的指定对象示例代码
Feb 28 Javascript
Extjs根据条件设置表格某行背景色示例
Jul 23 Javascript
ionic js 模型 $ionicModal 可以遮住用户主界面的内容框
Jun 06 Javascript
详解bootstrap的modal-remote两种加载方式【强化】
Jan 27 Javascript
JavaScript输出所选择起始与结束日期的方法
Jul 12 Javascript
vue组件通信传值操作示例
Jan 08 Javascript
js的各种数据类型判断的介绍
Jan 19 Javascript
ES6知识点整理之模块化的应用详解
Apr 15 Javascript
JavaScript中0、空字符串、'0'是true还是false的知识点分享
Sep 16 Javascript
VUE使用axios调用后台API接口的方法
Aug 03 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中文件上传的安全问题
2006/10/09 PHP
php strtotime 函数UNIX时间戳
2009/01/14 PHP
Php header()函数语法及使用代码
2013/11/04 PHP
注释PHP和html混合代码的小技巧(分享)
2016/11/03 PHP
为Plesk PHP7启用Oracle OCI8扩展方法总结
2019/03/29 PHP
JS 文件传参及处理技巧分析
2010/05/13 Javascript
深入分析JQuery和JavaScript的异同
2014/10/23 Javascript
jQuery中extend函数的实现原理详解
2015/02/03 Javascript
解决angularjs中同步执行http请求的方法
2018/08/13 Javascript
javascript实现弹出层效果
2019/12/10 Javascript
JS继承定义与使用方法简单示例
2020/02/19 Javascript
Echarts.js无法引入问题解决方案
2020/10/30 Javascript
Python 基础教程之闭包的使用方法
2017/09/29 Python
Python中分支语句与循环语句实例详解
2018/09/13 Python
使用Python轻松完成垃圾分类(基于图像识别)
2019/07/09 Python
Django错误:TypeError at / 'bool' object is not callable解决
2019/08/16 Python
python3-flask-3将信息写入日志的实操方法
2019/11/12 Python
python中upper是做什么用的
2020/07/20 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
Shopee新加坡:东南亚与台湾电商平台
2019/01/25 全球购物
Scotch Porter官方网站:男士美容产品
2020/08/31 全球购物
财务管理专业毕业生求职信范文
2013/09/21 职场文书
应届毕业生自我评价分享
2013/12/15 职场文书
三年级科学教学反思
2014/01/29 职场文书
《社戏》教学反思
2014/04/15 职场文书
机电专业毕业生求职信
2014/07/01 职场文书
测绘工程专业求职信
2014/07/15 职场文书
领导干部失职检讨书
2015/05/05 职场文书
幼儿园托班开学寄语(2015秋季)
2015/05/27 职场文书
运动会800米赞词
2015/07/22 职场文书
幼儿园卫生保健制度
2015/08/05 职场文书
教师正风肃纪心得体会
2016/01/15 职场文书
Python使用UDP实现720p视频传输的操作
2021/04/24 Python
如何用PHP websocket实现网页实时聊天
2021/05/26 PHP
vue-treeselect的基本用法以及解决点击无法出现拉下菜单
2022/04/30 Vue.js
MySQL一劳永逸永久支持输入中文的方法实例
2022/08/05 MySQL