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操作css样式
May 15 jQuery
Jquery把获取到的input值转换成json
May 15 jQuery
jQuery日期范围选择器附源码下载
May 23 jQuery
jQuery Easyui Treegrid实现显示checkbox功能
Aug 08 jQuery
浅谈jquery中ajax跨域提交的时候会有2次请求的问题
Nov 10 jQuery
jQuery实现表单动态添加与删除数据操作示例
Jul 03 jQuery
jQuery 操作 HTML 元素和属性的方法
Nov 12 jQuery
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
jQuery实现的鼠标拖动画矩形框示例【可兼容IE8】
May 17 jQuery
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
Jun 06 jQuery
jquery获取并修改触发事件的DOM元素示例【基于target 属性】
Oct 10 jQuery
jQuery+Ajax+js实现请求json格式数据并渲染到html页面操作示例
Jun 02 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
哪吒敖丙传:新人物二哥敖乙出场 小敖丙奶气十足
2020/03/08 国漫
php cookies中删除的一般赋值方法
2011/05/07 PHP
php中字符查找函数strpos、strrchr与strpbrk用法
2014/11/18 PHP
php提交表单发送邮件的方法
2015/03/20 PHP
yii2 开发api接口时优雅的处理全局异常的方法
2019/05/14 PHP
Alliance vs AM BO3 第二场2.13
2021/03/10 DOTA
通过jquery的$.getJSON做一个跨域ajax请求试验
2011/05/03 Javascript
javaScript(JS)替换节点实现思路介绍
2013/04/17 Javascript
javascript中eval函数用法分析
2015/04/25 Javascript
JS实现3D图片旋转展示效果代码
2015/09/22 Javascript
JS利用cookie记忆当前位置的防刷新导航效果
2015/10/15 Javascript
JavaScript仿支付宝6位数字密码输入框
2016/12/29 Javascript
JavaScript中offsetWidth的bug及解决方法
2017/05/17 Javascript
在小程序开发中使用npm的方法
2018/10/17 Javascript
微信公众平台获取access_token的方法步骤
2019/03/29 Javascript
Vue实现按钮级权限方案
2019/11/21 Javascript
详解Webpack抽离第三方类库以及common解决方案
2020/03/30 Javascript
Paypal支付不完全指北
2020/06/04 Javascript
解决vue请求接口第一次成功,第二次失败问题
2020/09/08 Javascript
[03:23:49]2016.12.17日完美“圣”典全回顾
2016/12/19 DOTA
[01:07:13]TNC vs Pain 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
测试、预发布后用python检测网页是否有日常链接
2014/06/03 Python
Python中使用Boolean操作符做真值测试实例
2015/01/30 Python
Python实现的彩票机选器实例
2015/06/17 Python
python traceback捕获并打印异常的方法
2018/08/31 Python
python实现切割url得到域名、协议、主机名等各个字段的例子
2019/07/25 Python
python3.6 tkinter实现屏保小程序
2019/07/30 Python
使用Python生成200个激活码的实现方法
2019/11/22 Python
关于win10在tensorflow的安装及在pycharm中运行步骤详解
2020/03/16 Python
Python xlwt模块使用代码实例
2020/06/10 Python
利用canvas实现图片压缩的示例代码
2018/07/17 HTML / CSS
房地产广告词大全
2014/03/19 职场文书
支部书记四风问题对照检查材料
2014/10/04 职场文书
妇联2016年六一国际儿童节活动总结
2016/04/06 职场文书
2019暑假阅读倡议书
2019/06/24 职场文书
Python3 如何开启自带http服务
2021/05/18 Python