jquery - jqueryはデータ属性を設定します

Question

HTML

<div id="you" data-you="Hello mean">super</div>

is #you html 要素変更 data-you 属性

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.

属性「data-you」は、変更しても変更されません。これどうやってするの？

ありがとうございました。

Answer 1

正しいものとして選択された答えがすでにありますが、何が起こっているのかを明確かつ簡潔に説明している答えはないようです。
それでは、これを試してみましょう：

$(element).data(key, value) 要素の html5 'data-*' 属性は変更されません。jQuery はキー値を内部的に (jQuery.cache に) 格納します。
その結果、呼び出す$(element).data(key)と、jQuery によって内部的に保存されているものが取得されます。

ここであなたの質問に答えるには：

HTMLタグの属性を変更しようとしているので、代わりにメソッドdata-youを使用する必要があります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.

Answer 2

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

データの例 http://api.jquery.com/data/ </p>

Answer 3

同じロジックで、結果を確認します。dataに変更attr

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

ライブデモを参照

Answer 4

これを試して：

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