jquery设置数据attr

25 jquery

HTML

<div id="you" data-you="Hello mean">super</div>
Run Code Online (Sandbox Code Playgroud)

是#you html元素更改数据 - 属性

console.log($("#you").data("you")); // Hello mean

$("#you").attr("data-you", "yes change you atribute");

console.log($("#you").data("you")); // Hello mean | does not change.
Run Code Online (Sandbox Code Playgroud)

当我改变时,属性"data-you"不会改变.我怎样才能做到这一点?

谢谢.

Raj*_*ani 72

已经有一个答案被选为正确答案,但似乎没有一个答案能够清楚,简明地解释正在发生的事情.
那么让我试一试:

$(element).data(key, value) 不会更改元素的html5'data-*'属性,jQuery在内部存储键值(在jQuery.cache中).
因此,当您调用时,您将$(element).data(key)获得jQuery内部存储的内容.

在这里回答你的问题:

由于您希望更改data-youhtml标记的属性,因此您需要使用该attr()方法

从而:

console.log($("#you").attr("data-you")); // Hello mean

$("#you").attr("data-you", "yes change you atribute");

console.log($("#you").attr("data-you")); // The data-you attribute has been changed.
Run Code Online (Sandbox Code Playgroud)

  • +1唯一正确且完整解释的答案 - 应该是接受的答案.jQuery data()和HTML'data-xyz'是两种完全不同的存储数据的方法,这仍然引起了很多混乱 - 从评论中可以看出这一点. (3认同)

Yaş*_*ÇLİ 27

attr()而且您不必更改data()方法.

尝试以下方式:

console.log($("#you").data("you")); // Hello mean

$("#you").data("you", "yes change you atribute"); // yes change you atribute

console.log($("#you").data("you")); //  yes change you atribute
Run Code Online (Sandbox Code Playgroud)

数据的例子 http://api.jquery.com/data/

  • 如果有人发现上述答案的第一行令人困惑,请在下面查看我的答案。 (2认同)