jquery.data()文档:http://api.jquery.com/jQuery.data/

html5有个data-*属性,跟这个功能一样

Note: This is a low-level method; a more convenient .data() is also available.

The jQuery.data() method allows us to attach data of any type to DOM elements in a way that is safe from circular references and therefore free from memory leaks. jQuery ensures that the data is removed when DOM elements are removed via jQuery methods, and when the user leaves the page. We can set several distinct values for a single element and retrieve them later:

jQuery.data( document.body, "foo", 52 );
jQuery.data( document.body, "bar", "test" );
 

Store then retrieve a value from the div element.

<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.data demo</title>
<style>
div {
color: blue;
}
span {
color: red;
}
</style>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body> <div>
The values stored were
<span></span>
and
<span></span>
</div> <script>
var div = $( "div" )[ 0 ];
jQuery.data( div, "test", {
first: 16,
last: "pizza!"
});
$( "span:first" ).text( jQuery.data( div, "test" ).first );
$( "span:last" ).text( jQuery.data( div, "test" ).last );
</script> </body>
</html>

jquery对象 http://api.jquery.com/data/

.data( key, value )

$( "body" ).data( "foo", 52 );
$( "body" ).data( "bar", { myType: "test", count: 40 } );
$( "body" ).data( { baz: [ 1, 2, 3 ] } );
$( "body" ).data( "foo" ); // 52
$( "body" ).data(); // { foo: 52, bar: { myType: "test", count: 40 }, baz: [ 1, 2, 3 ] }
 
更多:
 

jquery data方法的更多相关文章

  1. html 5 data-* (dataset) 属性和 jquery data方法比较

    一些文章在介绍html 5 data-* (dataset)属性时,会提到jquery的data方法,认为data方法能够很好的利用html 5的这个特性.但实际上,二者的兼容性是很差的.下面给出一段 ...

  2. JQuery data方法的使用-遁地龙卷风

    (-1)说明 我用的是chrome49,这个方法涉及到JQuery版本问题,我手里有3.0的,有1.9.1,后面将1.9.1及其以前的称为低版本,3.0称为高版本 测试例子用到的showMessage ...

  3. 转载 JQuery.data()方法学习

    转载原地址  http://hanchaohan.blog.51cto.com/2996417/1271551 转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.ht ...

  4. jquery data方法取值与js attr取值的区别

    <a data-v="3"></a> jquery data方法的运行机制: 第一次查找dom,使用attributes获取到dom节点值,并将其值存到缓存 ...

  5. jquery data方法获取某个元素上事件

    获取某个元素上的事件,jquery的给元素绑定的事件可以用data方法取出来. 通过$(element).data("events")来获取 // 比如给一个button绑定两个c ...

  6. jQuery 数据 - jQuery.data() 方法

    打印出 hi

  7. HTML5 自定义属性 data-* 和 jQuery.data 详解

    新的HTML5标准允许你在普通的元素标签里,嵌入类似data-*的属性,来实现一些简单数据的存取.它的数量不受限制,并且也能由javascript动态修改,也支持CSS选择器进行样式设置.这使得dat ...

  8. jquery.data()&jquery.extend()

    JQuery.data()方法 Jquery提供的在节点存取数据的方法. var $el = $('#app'); //使用键值对的方式存数据 $el.data('name', 'jinx'); $e ...

  9. Jquery 扩展方法实现原理

    JSONP原理 首先:JSON和JSONP是不一样的概念. JSON是一种数据交换格式,而JSONP是非正式传输协议. 该协议的一个要点就是允许用户传递一个callback参数给服务端,然后服务端返回 ...

随机推荐

  1. Mysql_存储功能

    先上一段代码: -->DELIMETER;     ----加上这一句:DELIMETER的作用是设定客户机的分隔符,表示用//包含的是一段程序,一起执行,而不是见到“:”就执行 结束的时候写上 ...

  2. 12天学好C语言——记录我的C语言学习之路(Day 9)

    12天学好C语言--记录我的C语言学习之路 Day 9: 函数部分告一段落,但是我们并不是把函数完全放下,因为函数无处不在,我们今后的程序仍然会大量运用到函数 //转入指针部分的学习,了解指针是什么 ...

  3. C#5.0之后推荐使用TPL(Task Parallel Libray 任务并行库) 和PLINQ(Parallel LINQ, 并行Linq). 其次是TAP(Task-based Asynchronous Pattern, 基于任务的异步模式)

    学习书籍: <C#本质论> 1--C#5.0之后推荐使用TPL(Task Parallel Libray 任务并行库) 和PLINQ(Parallel LINQ, 并行Linq). 其次是 ...

  4. HDU 1058 Humble Number

    Humble Number Problem Description A number whose only prime factors are 2,3,5 or 7 is called a humbl ...

  5. [PR & ML 6] [Introduction] Information Theory

  6. OpenJudge 2766 最大子矩阵

    1.链接: http://bailian.openjudge.cn/practice/2766 2.题目: 总Time Limit: 1000ms Memory Limit: 65536kB Desc ...

  7. 【nodemailer】 之邮件附件

    nodemailer 续 之前对nodemailer做了一个简单的了解,这篇文章主要研究一下如何添加附加文件 测试代码 //Created by yyrdl on 2015/10/2. var nod ...

  8. sea.js说明文档

    Sea.js 手册与文档 首页 | 索引 目录 模块定义 define id dependencies factory exports require require.async require.re ...

  9. OpenCV2学习笔记05:矩阵翻转

    对图像进行翻转或旋转可以使用cv::flip()函数,可以实现将一个二维矩阵沿X轴.Y轴或者同时沿XY轴翻转.函数原型如下: C++: void flip(InputArray src, Output ...

  10. sql 修改字段小记

    增加字段默认值: alter table 表名 ADD 字段 类型 NULL Default 0 修改字段类型: alter table 表名 alter column UnitPrice decim ...