HTML5自定义属性 - 我为什么要使用它们？

Question

我似乎无法理解为什么我应该对HTML5允许自定义属性感到满意？我为什么要用它们？

Answer 1

我假设您正在引用HTML5 [data-*]属性.

优点是您可以轻松地将一些脚本数据(仍然是语义的,但不是用于显示)与您的元素相关联,而无需在整个地方插入内联javascript,它将是有效的HTML5.要在HTML4中执行相同操作,需要指定自定义命名空间,并添加一些命名空间属性.

假设您有一个待售商品列表,您可能希望存储数字价格而不尝试解析字符串:

<ul>
  <li data-price="5">Item 1 is only $5 this week!</li>
  <li data-price="1">Sale on Item 2, only $1</li>
  ...
</ul>

如果您允许用户标记要购买的许多不同商品,则可以轻松提取数值以显示运行总计.

或者,您可以将数字放在具有特定类的范围中,在正确的项目上找到正确的范围,然后以该方式提取值,但[data-*]属性会减少执行相同操作所需的标记/脚本数量.

如果您不想使用它,则不需要.有许多方法可以将数据与元素相关联,这只是一个新方法.

此外,新的datasetJavaScript API提供了一种以声明方式访问存储在[data-*]属性中的值的一致方法.

jQuery的用户,.data()并且.attr()可以用来访问[data-*]属性,我已经写了上,当你想使用一个比其他详细的解答.