jQuery.data()
jQuery.data( element, key, value ) 官网原E文： jQuery
描述： 在匹配远上绑定任意相关数据。
-
version added: 1.2.3jQuery.data( element, key, value )
element要关联数据的DOM对象
key存储的数据名
value新数据值
注意这是一个底层的方法，你应该用.data()代替。
jQuery.data() 方法允许我们在DOM元素上附加任意类型的数据,避免了循环引用的内存泄漏风险。
jQuery ensures that the data is removed when DOM elements are removed via jQuery methods, and when the user leaves the page. 我们可以在一个元素上设置不同的值，并获取这些值：
jQuery.data(document.body, 'foo', 52); jQuery.data(document.body, 'bar', 'test');
注意:
- 注意这个方法目前并不提供在XML文档上跨平台设置，作为Internet Explorer不允许通过自定义属性附加数据。
例子：
Store then retrieve a value from the div element.
<!DOCTYPE html>
<html>
<head>
<style>
div { color:blue; }
span { color:red; }
</style>
<script src="http://code.jquery.com/jquery-latest.min.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>Demo:
jQuery.data( element, key ) 官网原E文： Object
描述： 返回元素上储存的相应名字的数据，可以用data(name, value)来设定。
-
version added: 1.2.3jQuery.data( element, key )
element要关联数据的DOM对象
key存储的数据名
-
version added: 1.4jQuery.data( element )
element要关联数据的DOM对象
注意这是一个底层的方法，你应该用.data()代替。
.data()方法允许我们在DOM元素上附加任意类型的数据,避免了循环引用的内存泄漏风险。我们可以在一个元素上设置不同的值，并获取这些值：
alert(jQuery.data( document.body, 'foo' )); alert(jQuery.data( document.body ));
上面几行代码alert body元素上设置的值。若果没有设置任何值，那么将返回null。
调用没有参数的jQuery.data(element)时将获取一个作为JavaScript对象的所有值。jQuery内部自身使用这个方法来绑定数据，如事件处理器，所以不要以为这只包含数据储存你的代码。
HTML 5 data- 属性
直jQuery 1.4.3起， HTML 5 data- 属性 将自动被引用到jQuery的数据对象中。
举个例子, 给定下面的HTML:
<div data-role="page" data-hidden="true" data-options='{"name":"John"}'></div>
All of the following jQuery code will work.
$("div").data("role") === "page";
$("div").data("hidden") === true;
$("div").data("options").name === "John";
Note that strings are left intact while JavaScript values are converted to their associated value (this includes booleans, numbers, objects, arrays, and null). The data- attributes are pulled in the first time the data property is accessed and then are no longer accessed or mutated (all data values are then stored internally in jQuery).
注意:
- 注意这个方法目前并不提供在XML文档上跨平台设置，作为Internet Explorer不允许通过自定义属性附加数据。
例子：
Get the data named "blah" stored at for an element.
<!DOCTYPE html>
<html>
<head>
<style>
div { margin:5px; background:yellow; }
button { margin:5px; font-size:14px; }
p { margin:5px; color:blue; }
span { color:red; }
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<div>A div</div>
<button>Get "blah" from the div</button>
<button>Set "blah" to "hello"</button>
<button>Set "blah" to 86</button>
<button>Remove "blah" from the div</button>
<p>The "blah" value of this div is <span>?</span></p>
<script>
$("button").click(function(e) {
var value, div = $("div")[0];
switch ($("button").index(this)) {
case 0 :
value = jQuery.data(div, "blah");
break;
case 1 :
jQuery.data(div, "blah", "hello");
value = "Stored!";
break;
case 2 :
jQuery.data(div, "blah", 86);
value = "Stored!";
break;
case 3 :
jQuery.removeData(div, "blah");
value = "Removed!";
break;
}
$("span").text("" + value);
});
</script>
</body>
</html>