メソッドはHTML 属性.data
を変更しません。data-
jQuery が内部的に格納する変数を変更します。
属性を本当に変更する必要がある場合は、次のメソッドdata-
で明示的に変更してください。.attr()
$(el).attr('data-original-title', str);
ただし、これは によって返される値を変更しません.data
。jQuery は、内部に保存されている値が見つからない場合にのみdata-
、 HTML 属性からその値を取得しますHTML 属性を変更して再度取得すると、変更されていないことがわかります。$(el).data('original-title')
これが問題である場合は、メソッド.removeData()
を使用して内部に保存された値を削除します。次に を使用する.data()
と、jQuery はそれが欠落していることを認識し、data-
HTML 属性を取得します。
見てみましょう: http://jsfiddle.net/mblase75/LHCUK/
HTML:
<p id="p" data-title="blah"></p>
jQuery:
console.log($('#p').data('title')); // returns "blah"
// alter the attribute directly
$('#p').attr('data-title','whooo'); // data-title="whooo"
// test if .data is changed
console.log($('#p').data('title')); // still returns "blah"
// delete the .data() value
$('#p').removeData('title');
// now fetch it again -- it will retrieve the new data- attribute
console.log($('#p').data('title')); // returns "whooo"
さて、実際には、これについて心配する必要はありません。data-
属性は変数の初期値を表すもので.data()
あり、必ずしもその変数の現在の値を表すものではないことを覚えておいてください。問題ありません。
要約すると、このメソッドは、ドキュメントが読み込まれるときに一度.data()
HTML 要素から値を取得し、変数が内部に保存されている限り、再度取得することはありません。