jquery - 我可以在 div 上使用自定义属性吗？

Question

我需要在 jQuery 中获取一个数字值，但为了使其正常工作，我需要在我的 div 上添加第三个属性。

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

这很好用!但是 HTML 验证器告诉我:

Error: Attribute numberlk not allowed on element div at this point.

我该怎么做才能让它正常工作？

Answer 1

虽然可以在 HTML 中创建您自己的属性，但您不应该这么做。这是因为它会使您的 HTML 无效，这可能会导致 UI 以及页面上运行的任何 Javascript 出现意外问题。

在元素中存储自定义元数据的更好方法是使用 data 属性，例如 data-numberlk="$total"

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

然后您可以使用 data() 方法在 jQuery 中检索此值:

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

或者使用纯 JS:

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