为什么我在自定义属性前添加“ data-”？

保留自定义属性以data- *为前缀有几个好处。

1. 它保证在将来的版本中不会与HTML扩展发生冲突。HTML5中引入的一些新属性已经在某种程度上遇到了这个问题，现有站点正在使用具有相同名称的属性，并且期望使用不同且不兼容的自定义行为。（例如，众所周知，元素的

   required

   属性

   input

   过去在某些流行的网站上发生过冲突）

2. 有一个方便的DOM API HTMLElement.dataset，用于从脚本访问这些属性。现在大多数浏览器都支持它。

3. 它们清楚地表明哪些属性是自定义属性，哪些属性是标准化属性。这不仅允许验证者允许任何带有data- *的属性，同时仍对其他属性执行有用的错误检查（例如，捕获输入错误），从而帮助验证者，而且还有助于使源代码的这一方面对那些阅读它的人（包括人们）更清晰在原作者之后可能会在网站上工作的人。