jquery - jQuery とデータ属性

Question

このコードが 0 を返すのはどのような場合ですか?

$(this).parent().data("id")

そして、このコードは実際の値を返しますか?

$(this).parent().attr("data-id")

ありがとう。

Answer 1

.data("id")と.attr("data-id")が異なる値を返す場合、データ プロパティの値がidjQuerydata()関数によって更新されているか、data-idへの最初の呼び出し以降に属性値が更新されています.data("id")。

jQuerydata()関数はdata-、要素の属性を使用して、そのデータ プロパティの値を初期化します。ただし、data プロパティへの変更は HTML に反映されません。したがって、を使用して値を更新しても、属性は更新されdata()ません。

ドキュメントから：

data- 属性は、 data プロパティが最初にアクセスされたときに取得され、その後はアクセスも変更もされません (その後、すべてのデータ値は内部的に jQuery に保存されます)。

HTML

<div id="myDiv" data-id="realValue"></div>

jQuery

$('#myDiv').data('id'); //returns 'realValue'
$('#myDiv').data('id', 0);
$('#myDiv').data('id'); //returns 0
$('#myDiv').attr('data-id'); //returns 'realValue'