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之水平横向滚动歌词同步的应用
May 07 Javascript
jquery multiSelect 多选下拉框
Jul 09 Javascript
目前流行的JavaScript库的介绍及对比
Sep 29 Javascript
使用jQuery实现验证上传图片的格式与大小
Dec 03 Javascript
jQuery Validate设置onkeyup验证的实例代码
Dec 09 Javascript
canvas 绘制圆形时钟
Feb 22 Javascript
详解Vue-基本标签和自定义控件
Mar 24 Javascript
angular仿支付宝密码框输入效果
Mar 25 Javascript
JavaScript事件对象event用法分析
Jul 27 Javascript
VUE基于NUXT的SSR 服务端渲染
Nov 30 Javascript
JS相册图片抖动放大展示效果的示例代码
Jan 29 Javascript
微信小程序实现轮播图指示器
Jun 25 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
APACHE的AcceptPathInfo指令使用介绍
2013/01/18 PHP
php自动加载autoload机制示例分享
2014/02/20 PHP
PHPExcel读取EXCEL中的图片并保存到本地的方法
2015/02/14 PHP
PHP基于DateTime类解决Unix时间戳与日期互转问题【针对1970年前及2038年后时间戳】
2018/06/13 PHP
laravel通用化的CURD的实现
2019/12/13 PHP
通过代码实例解析PHP session工作原理
2020/12/11 PHP
Javascript 面向对象 对象(Object)
2010/05/13 Javascript
JavaScript中链式调用之研习
2011/04/07 Javascript
jquery实现简单文字提示效果
2015/12/02 Javascript
jQuery.form插件的使用及跨域异步上传文件
2016/04/27 Javascript
微信禁止下拉查看URL的处理方法
2017/09/28 Javascript
Vue2.0实现组件数据的双向绑定问题
2018/03/06 Javascript
微信小程序如何播放腾讯视频的实现
2019/09/20 Javascript
vue学习笔记之作用域插槽实例分析
2020/02/01 Javascript
jQuery实现可以计算进制转换的计算器
2020/10/19 jQuery
[01:02:09]Liquid vs TNC 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21
2020/07/19 DOTA
python虚拟环境virualenv的安装与使用
2016/12/18 Python
python2.7读取文件夹下所有文件名称及内容的方法
2018/02/24 Python
python os.path模块常用方法实例详解
2018/09/16 Python
python实现飞机大战小游戏
2019/11/08 Python
python numpy 矩阵堆叠实例
2020/01/17 Python
Django自关联实现多级联动查询实例
2020/05/19 Python
Keras之fit_generator与train_on_batch用法
2020/06/17 Python
pytorch使用horovod多gpu训练的实现
2020/09/09 Python
使用Python实现音频双通道分离
2020/12/25 Python
移动Web—CSS为Retina屏幕替换更高质量的图片
2012/12/24 HTML / CSS
世界上最大的汽车共享网站:Zipcar
2017/01/14 全球购物
VICHY薇姿美国官方网站:欧洲药房第一的抗衰老品牌
2017/11/22 全球购物
环境工程大学生自荐信
2013/10/21 职场文书
高三家长寄语
2014/04/03 职场文书
大学生考试作弊检讨书1000字
2014/10/14 职场文书
财务人员个人工作总结
2015/02/27 职场文书
2016年小学生寒假家长评语
2015/10/10 职场文书
Html5生成验证码的示例代码
2021/05/10 Javascript
Javascript使用integrity属性进行安全验证
2021/11/07 Javascript
PYTHON使用Matplotlib去实现各种条形图的绘制
2022/03/22 Python