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