jQuery data()函数做了什么

我还没有找到jquery函数data().的用法data(). 谁能给我一些如何使用它的例子?

它对于将各种对象,字符串,数组等与DOM元素相关联非常有用。 这是一个有趣的假设用法:

 $(document).ready(function(){ $("a").each(function(index, el){ if(index % 2 == 0) $(this).data('coolColor', 'Orange'); // Set the data else $(this).data('coolColor', 'Purple'); // Set the data }).click(function(e){ alert($(this).data('coolColor')); // Retrieve the data e.preventDefault(); }); }); 

这将选择每个标签,如果是奇数则设置Orange如果是偶数则设置Purple 。 如果这是您真正想要的,那么这不是编写此代码的最佳方式,但它确实说明了如何使用.data()函数。

您还可以使用它来存储对象:

 $("#header").data('headerSettings',{ color: "red", cost: "$25.00", time: 1000 }); 

现在,您可以在页面上的任何其他位置访问该数据:

 $("#header").data('headerSettings').color; 

它允许您将任何类型的数据与DOM元素相关联。 有关示例,请参阅此博客文章。

我认为这个问题需要更多的关注。 jQuery的data API对于各种用例来说非常强大。

jQuery的数据函数允许您使用任何jQuery对象存储和检索任何关联的数据。

首先,它还可以用于读取html中任何节点上设置的data-属性。

例1

HTML:

jQuery代码: $("#myNode").data("foo") //bar

例2

同样,我也可以存储任何节点的值。

jQuery代码:

$("#myNode").data("foo","baz") $("#myNode").data("foo") //baz

这里要注意的一件重要事情是,当使用数据API在笔记上设置数据时,不会在DOM中更新html。 如果要更新HTML,可能需要坚持使用attr("data-foo","baz")方法。

虽然可以读取存储在HTML数据属性中的字符串,但您也可以在使用数据API存储值时分配对象。

开发人员将对象与节点链接在一起的各种用例。

例如

 var obj = { name : "test" } $("#myNode").data("foo",obj); $("#myNode").data("foo") === obj //true 

来吧, 在这里探索API。

jQuery文档很好地总结了它:

返回元素的唯一ID。

通常,此function仅在内部使用。 您可能不会以这种方式使用data()方法。 在使用其他data()function时,必要时会自动调用它。

基本上,此函数用于支持其他jQuery函数。 最好忽略此函数,因为它不打算成为jQuery API的公共接口的一部分。