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 Ajax使用FormData上传文件和其他数据后端web.py获取
Jun 11 jQuery
jQuery实现 RadioButton做必选校验功能
Jun 15 jQuery
jQuery实现导航栏头部菜单项点击后变换颜色的方法
Jul 19 jQuery
jQuery plugin animsition使用小结
Sep 14 jQuery
jquery实现图片跟随鼠标的实例
Oct 17 jQuery
jQuery实现菜单的显示和隐藏功能示例
Jul 24 jQuery
解决jQuery使用append添加的元素事件无效的问题
Aug 30 jQuery
为jquery的ajax请求添加超时timeout时间的操作方法
Sep 04 jQuery
jQuery实现小火箭返回顶部特效
Feb 03 jQuery
jquery实现点击弹出对话框
Feb 08 jQuery
jQuery实现html可联动的百分比进度条
Mar 26 jQuery
jQuery插件simplePagination的使用方法示例
Apr 28 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
PHP中的output_buffering详细介绍
2014/09/27 PHP
PHP判断来访是搜索引擎蜘蛛还是普通用户的代码小结
2015/09/14 PHP
脚本吧 - 幻宇工作室用到js,超强推荐share.js
2006/12/23 Javascript
用cssText批量修改样式
2009/08/29 Javascript
jQuery基础知识filter()和find()实例说明
2010/07/06 Javascript
Jquery中删除元素的实现代码
2011/12/29 Javascript
javascript仿php的print_r函数输出json数据
2013/09/13 Javascript
JS清除字符串中重复值的实现方法
2016/08/03 Javascript
bootstrap table 数据表格行内修改的实现代码
2017/02/13 Javascript
jquery ztree实现右键收藏功能
2017/11/20 jQuery
bootstrap table实现iview固定列的效果实例代码详解
2019/09/30 Javascript
JS面试题中深拷贝的实现讲解
2020/05/07 Javascript
javascript实现图片轮换动作方法
2020/08/07 Javascript
vue实现移动端拖动排序
2020/08/21 Javascript
js实现简单的轮播图效果
2020/12/13 Javascript
浅谈pyhton学习中出现的各种问题(新手必看)
2017/05/17 Python
Python实现的计数排序算法示例
2017/11/29 Python
Python实现比较扑克牌大小程序代码示例
2017/12/06 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
Python图片的横坐标汉字实例
2019/12/04 Python
在Keras中CNN联合LSTM进行分类实例
2020/06/29 Python
python 删除系统中的文件(按时间,大小,扩展名)
2020/11/19 Python
python使用smtplib模块发送邮件
2020/12/17 Python
日本无添加化妆品:HABA
2016/08/18 全球购物
佳能加拿大网上商店:Canon eStore Canada
2018/04/04 全球购物
丝芙兰意大利官方网站:Sephora.it
2019/12/13 全球购物
沃尔玛加拿大:Walmart.ca
2020/03/02 全球购物
大学生村官任职感言
2014/01/09 职场文书
好矿嫂事迹材料
2014/01/21 职场文书
党员干部对十八届四中全会的期盼
2014/10/17 职场文书
2015年七一建党节活动总结
2015/03/20 职场文书
未中标通知书
2015/04/17 职场文书
寻找最美乡村教师观后感
2015/06/18 职场文书
2016五一手机促销广告语
2016/01/28 职场文书
会议主持词通用版
2019/04/02 职场文书
tensorflow学习笔记之tfrecord文件的生成与读取
2021/03/31 Python