HTML5 の詳細な仕様を読むと、このカスタム データ属性の使用法は非常に簡単であることがわかります。つまり、「data-」で始まる任意の属性を HTML タグに追加できます。ページに表示される場合、ページのレイアウトやスタイルには影響しませんが、読み取りと書き込みは可能です。
このメソッドはすでに jquery に組み込まれています。データは $('#content').data('list'); を通じて取得できます。このメソッドは jQuery バージョン 1.4.3 以降に登場し、対応するデータ属性を返すことができます。 .
<頭>
jquery を使用して HTML5 データを操作する -*
http://code.jquery.com/jquery-2.1.0.min.js">>
<スクリプト>
$(関数(){
//data-*
の値を読み取る
$("li").each(function(v) {
console.log($(this).data('name'));
});
//data-*
の値を設定します
$("li").eq(0).data('name','bryant');
$("li").each(function(v) {
console.log($(this).data('name'));
});
//dataの値を削除します-* ここではremoveAttrが使用されており、公式のremoveDataテストは機能しません
$("li").eq(0).removeAttr('データ名');
$("li").each(function(v) {
console.log($(this).data('name'));
});
})