详谈$.data()的用法和作用


Posted in Javascript onFebruary 13, 2017

jQuery.data 即$.data()。向元素附加数据,然后取回该数据

这是提供给客户端程序员使用的方法,它同时是setter/getter。

传一个参数,返回附加在指定元素的所有数据,即thisCachejQuery.data(el); // thisCache

传二个参数,返回指定的属性值jQuery.data(el, 'name');

传三个参数,设置属性及属性值jQuery.data(el, 'name', 'jack');jQuery.data(el, 'uu', {});

传四个参数,第四个参数pvt仅提供给jQuery库自身使用。即jQuery._data方法中传true。因为jQuery的事件模块严重依赖于jQuery.data,为避免人为的不小心重写在这个版本中加入的

$.data("#blog_stats","name","lixuekai")
jquery.js:2 Uncaught TypeError: Cannot set property 'toJSON' of undefined(…)data @ jquery.js:2(anonymous function) @ VM913:1
var s = $("#blog_stats")
undefined
s
[<div id=​"blog_stats">​…​</div>​]
$.data(s,"name","lixuekai")
"lixuekai"
$.data(s,"name")
"lixuekai"
$.data(s)
Object {name: "lixuekai"}
$.hasData(s)

true上面代码的调试图如下:

详谈$.data()的用法和作用

jQuery.hasData 用来判断HTMLElement或JS对象是否具有数据。返回true或false。即如果调用了jQuery.data方法添加了属性,则返回true。

升级简单的写法:selector.data("key","value").

实测如下图:

详谈$.data()的用法和作用

这是一个位置给装了2个对象数据。然后看看效果如何。

就看截图吧,代码就不贴啦。

//从被选元素中返回附加的数据。
$(selector).data(name)

//向被选元素附加数据。
$(selector).data(name,value)

//使用带有名称/值对的对象向被选元素添加数据。(上面传简单的key value 键值对,这个直接给对象,不用一个个传)
$(selector).data(object)

以上这篇详谈$.data()的用法和作用就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery的给文章加入关键字链接
Oct 26 Javascript
jquery仿搜索自动联想功能代码
May 23 Javascript
jQuery实现鼠标经过图片变亮其他变暗效果
May 08 Javascript
jQuery取消特定的click事件
Feb 29 Javascript
浅谈js的ajax的异步和同步请求的问题
Oct 07 Javascript
Jqprint实现页面打印
Jan 06 Javascript
angular中实现li或者某个元素点击变色的两种方法
Jul 27 Javascript
浅谈Vue响应式(数组变异方法)
May 07 Javascript
vue实现在一个方法执行完后执行另一个方法的示例
Aug 25 Javascript
Vue CLI3 如何支持less的方法示例
Aug 29 Javascript
详解vue-router传参的两种方式
Sep 10 Javascript
JavaScript回调函数callback用法解析
Jan 14 Javascript
基于Angularjs+mybatis实现二级评论系统(仿简书)
Feb 13 #Javascript
JavaScript实现公历转农历功能示例
Feb 13 #Javascript
JS判断键盘是否按的回车键并触发指定按钮点击操作的方法
Feb 13 #Javascript
jQuery源码分析之sizzle选择器详解
Feb 13 #Javascript
JS中input表单隐藏域及其使用方法
Feb 13 #Javascript
浅谈键盘上回车按钮的js触发事件
Feb 13 #Javascript
jQuery源码分析之init的详细介绍
Feb 13 #Javascript
You might like
将RTF格式的文件转成HTML并在网页中显示的代码
2006/10/09 PHP
php启用sphinx全文搜索的实现方法
2014/12/24 PHP
PHP工厂模式的日常使用
2019/03/20 PHP
关于JavaScript中var声明变量作用域的推断
2010/12/16 Javascript
jquery 插件学习(四)
2012/08/06 Javascript
js修改地址栏URL参数解决url参数问题
2012/12/15 Javascript
JQueryEasyUI Layout布局框架的使用
2013/04/08 Javascript
jQuery实现用户注册的表单验证示例
2013/08/28 Javascript
js判断数据类型如判断是否为数组是否为字符串等等
2014/01/15 Javascript
jquery根据属性和index来查找属性值并操作
2014/07/25 Javascript
jQuery中DOM操作实例分析
2015/01/23 Javascript
浅析JavaScript中的事件机制
2015/06/04 Javascript
浅谈javascript的Touch事件
2015/09/27 Javascript
微信小程序 swiper制作tab切换实现附源码
2017/01/21 Javascript
JavaScript制作简易计算器(不用eval)
2017/02/05 Javascript
详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)
2017/02/10 Javascript
three.js实现3D视野缩放效果
2017/11/16 Javascript
vue组件的写法汇总
2018/04/12 Javascript
Vue数据双向绑定原理及简单实现方法
2018/05/18 Javascript
element ui分页多选,翻页记忆的实例
2019/09/03 Javascript
教你如何用Node实现API的转发(某音乐)
2019/09/20 Javascript
深入了解JS之作用域和闭包
2020/06/16 Javascript
Python生成不重复随机值的方法
2015/05/11 Python
很酷的HTML5电子书翻页动画特效
2016/02/25 HTML / CSS
升职自荐信范文
2013/10/05 职场文书
玩具公司的创业计划书
2013/12/31 职场文书
什么样的创业计划书可行性高?
2014/02/01 职场文书
趣味活动策划方案
2014/02/08 职场文书
物业前台接待岗位职责
2015/04/03 职场文书
无罪辩护词范文
2015/05/21 职场文书
学校运动会感想
2015/08/10 职场文书
辅导员学期工作总结
2015/08/14 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
网络安全倡议书(3篇)
2019/09/18 职场文书
MySql新手入门的基本操作汇总
2021/05/13 MySQL
抖音动画片,皮皮虾,《治愈系》动画在用这首REMIX作为背景音乐,Anak ,The last world with you完整版
2022/03/16 杂记