Jquery-data的三种用法


Posted in jQuery onApril 18, 2017

记录一下

Jquery-data的用处:

jQuery-data主要是用来存储数据,帮助普通对象或者jQuery对象来存储数据,其实如果单纯的储存dom的单一的属性,用attr自定义属性足够了;如果存储多个键值对建议用jQuery-data;

例如: 图片的懒加载好多插件就用到了jquery-data,先把图片的真实地址储存到jquery-data中,做个监听事件,等到滑到该图片时再把真实地址取出来;

用法一:给普通对象储存单个属性和取值

<script type="text/javascript" src="jquery-3.0.0.min.js"></script>
 var obj = {};
 $.data(obj, 'name', 'xm'); // 赋值
 var str = $.data(obj, 'name'); // 读取值
 console.log(str) // "xm"

用法二:给普通对象储存多个属性和取值

<script type="text/javascript" src="jquery-3.0.0.min.js"></script>
var obj = {};
 $.data(obj,{name1:"xm",name2:"xh"}); // 赋值
 var str1 = $.data(obj, 'name1'); // 读取值
 var str2 = $.data(obj, 'name2'); // 读取值
 console.log(str1) // "xm"
 console.log(str1) // "xh"

用法三:给Jquery dom对象取值赋值

<div class="demo"></div>
<script type="text/javascript" src="jquery-3.0.0.min.js"></script>
var obj = $('.demo');
 $.data(obj,{name1:"xm",name2:"xh"}); // 赋值
 var str1 = $.data(obj, 'name1'); // 读取值
 var str2 = $.data(obj, 'name2'); // 读取值
 console.log(str1) // "xm"
 console.log(str1) // "xh"
// 就是把obj换成jquery对象这么简单

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

jQuery 相关文章推荐
jQuery加密密码到cookie的实现代码
Apr 18 jQuery
bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果
Jun 12 jQuery
jQuery EasyUI的TreeGrid查询功能实现方法
Aug 08 jQuery
jQuery实现的简单前端搜索功能示例
Oct 28 jQuery
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
jQuery表单选择器用法详解
Aug 22 jQuery
jquery实现掷骰子小游戏
Oct 24 jQuery
JQuery事件冒泡和默认行为代码实例
May 13 jQuery
jquery+css3实现的经典弹出层效果示例
May 16 jQuery
jquery更改元素属性attr()方法操作示例
May 22 jQuery
jquery自定义组件实例详解
Dec 31 jQuery
jQuery使用hide()、toggle()函数实现相机品牌展示隐藏功能
Jan 29 jQuery
JS与jQuery实现子窗口获取父窗口元素值的方法
Apr 17 #jQuery
jQuery实现动态生成表格并为行绑定单击变色动作的方法
Apr 17 #jQuery
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
Apr 14 #jQuery
jQuery EasyUI 为Combo,Combobox添加清除值功能的实例
Apr 13 #jQuery
为Jquery EasyUI 组件加上清除功能的方法(详解)
Apr 13 #jQuery
为JQuery EasyUI 表单组件增加焦点切换功能的方法
Apr 13 #jQuery
详谈jQuery.load()和Jsp的include的区别
Apr 12 #jQuery
You might like
[EPIC] Larva vs Flash ZvT @ Crossing Field [2017-10-09]
2020/03/17 星际争霸
php中http_build_query 的一个问题
2012/03/25 PHP
PHP 处理TXT文件(打开/关闭/检查/读取)
2013/05/13 PHP
php实现自动获取生成文章主题关键词功能的深入分析
2013/06/03 PHP
php多用户读写文件冲突的解决办法
2013/11/06 PHP
php构造函数的继承方法
2015/02/09 PHP
PHP+apc+ajax实现的ajax_upload上传进度条代码
2016/01/25 PHP
PHP的JSON封装、转变及输出操作示例
2019/09/27 PHP
QUnit jQuery的TDD框架
2010/11/04 Javascript
IE与Firefox在JavaScript上的7个不同句法分享
2011/10/30 Javascript
JS代码放在head和body中的区别分析
2011/12/01 Javascript
JQuery中的事件及动画用法实例
2015/01/26 Javascript
jQuery实现DIV层淡入淡出拖动特效的方法
2015/02/13 Javascript
谈谈基于iframe、FormData、FileReader三种无刷新上传文件的方法
2015/12/03 Javascript
快速解决Canvas.toDataURL 图片跨域的问题
2016/05/10 Javascript
vue2项目使用sass的示例代码
2017/06/28 Javascript
微信小程序 腾讯地图显示偏差问题解决
2019/07/27 Javascript
Node.js开发之套接字(socket)编程入门示例
2019/11/05 Javascript
vue同个按钮控制展开和折叠同个事件操作
2020/07/29 Javascript
[45:18]完美世界DOTA2联赛循环赛 PXG vs IO 第二场 11.06
2020/11/09 DOTA
python通过colorama模块在控制台输出彩色文字的方法
2015/03/19 Python
Django 多表关联 存储 使用方法详解 ManyToManyField save
2019/08/09 Python
使用Pyhton集合set()实现成果查漏的例子
2019/11/24 Python
Python代码块及缓存机制原理详解
2019/12/13 Python
python中数字是否为可变类型
2020/07/08 Python
欧舒丹澳洲版:L’OCCITANE
2017/07/17 全球购物
Ashford台湾:以折扣价提供奢华的男女用表款
2019/12/04 全球购物
大学生2014全国两会学习心得体会
2014/03/10 职场文书
银行青年文明号事迹材料
2014/05/31 职场文书
户籍证明格式
2014/09/15 职场文书
领导班子个人查摆问题对照检查材料
2014/10/02 职场文书
机动车登记业务委托书
2014/10/08 职场文书
2014村书记党建工作汇报材料
2014/11/02 职场文书
初中生活随笔
2015/08/15 职场文书
nginx配置之并发频次限制
2022/04/18 Servers
PYTHON 使用 Pandas 删除某列指定值所在的行
2022/04/28 Python