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和html+css实现带小圆点和左右按钮的轮播图实例
Jul 22 jQuery
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
React中jquery引用的实现方法
Sep 12 jQuery
jQuery选择器之子元素过滤选择器
Sep 28 jQuery
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
关于jquery layui弹出层的使用方法
Apr 21 jQuery
jQuery点击页面其他部分隐藏下拉菜单功能
Nov 27 jQuery
JQuery中queue方法用法示例
Jan 31 jQuery
jquery ajax 请求小技巧实例分析
Nov 11 jQuery
jQuery实现消息弹出框效果
Dec 10 jQuery
Jquery cookie插件实现原理代码解析
Aug 04 jQuery
jQuery实现带进度条的轮播图
Sep 13 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编程最快明白》第二讲 数字、浮点、布尔型、字符串和数组
2010/11/01 PHP
php使用ICQ网关发送手机短信
2013/10/30 PHP
php解析json数据实例
2014/08/19 PHP
PHP答题类应用接口实例
2015/02/09 PHP
laravel 框架实现无限级分类的方法示例
2019/10/31 PHP
父窗口获取弹出子窗口文本框的值
2006/06/27 Javascript
jQuery Validation插件remote验证方式的Bug解决
2010/07/01 Javascript
图片Slider 带左右按钮的js示例
2013/08/30 Javascript
js读写cookie实现一个底部广告浮层效果的两种方法
2013/12/29 Javascript
js实现回放拖拽轨迹从过程上进行分析
2014/06/26 Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
2015/08/20 Javascript
bootstrap-datetimepicker实现只显示到日期的方法
2016/11/25 Javascript
vue 对axios get pust put delete封装的实例代码
2020/01/05 Javascript
[02:54]DOTA2英雄基础教程 撼地者
2014/01/14 DOTA
[42:20]2014 DOTA2华西杯精英邀请赛5 24 DK VS NewBee
2014/05/25 DOTA
[01:15:15]VG VS EG Supermajor小组赛B组胜者组第一轮 BO3第二场 6.2
2018/06/03 DOTA
Python使用matplotlib的pie函数绘制饼状图功能示例
2018/01/08 Python
Python异常处理操作实例详解
2018/08/28 Python
在python里面运用多继承方法详解
2019/07/01 Python
关于Python 的简单栅格图像边界提取方法
2019/07/05 Python
flask框架路由常用定义方式总结
2019/07/23 Python
Python三维绘图之Matplotlib库的使用方法
2020/09/20 Python
美国玛丽莎收藏奢华时尚商店:Marissa Collections
2016/11/21 全球购物
西班牙香水和化妆品网上商店:Douglas
2017/10/29 全球购物
Java方面的关于数组和继承的笔面试题
2015/09/18 面试题
C++:memset ,memcpy和strcpy的根本区别
2013/04/27 面试题
描述内存分配方式以及它们的区别
2016/10/15 面试题
食堂个人先进事迹
2014/01/22 职场文书
公司拓展活动方案
2014/02/13 职场文书
保卫科工作岗位职责
2014/03/01 职场文书
地陪导游欢迎词
2015/01/26 职场文书
同意转租证明
2015/06/24 职场文书
小学体育教学随笔
2015/08/14 职场文书
使用Oracle命令进行数据库备份与还原
2021/12/06 Oracle
CSS使用SVG实现动态分布的圆环发散路径动画
2022/12/24 HTML / CSS
HTML中link标签属性的具体用法
2023/05/07 HTML / CSS