divでカスタム属性を使用できますか?

2015-09-18 jquery html css

jQueryで数値を取得する必要がありますが、これを機能させるにはdiv 3番目の属性が必要です。

<div class="button" id="button$post" numberlk="$total">

これはうまくいきます!しかし、バリデーターはHTMLを教えてくれます:

エラー:この時点では、要素divで属性numberlkは許可されていません。

正しく動作させるにはどうすればよいですか?

Answers

HTMLに独自の属性を作成することは可能ですが、できません。これは、HTMLが無効になり、UIおよびページで実行されているJavascriptで予期しない問題が発生する可能性があるためです。

要素のHTMLにカスタムメタデータを保存するより良い方法は、代わりにdata属性を使用するdataです。例: data-numberlk="$totallikes"

<div class="button" id="button$post" data-numberlk="$total">

次に、 data()メソッドを使用して、jQueryでこの値を取得できます。

var likes = $('.button').data('numberlk');

または、プレーンJSを使用します。

var likes = document.querySelector('.button').dataset.numberlk;

Related