我可以在我的 HTML 标签上编写属性吗?

IT技术 javascript html
2021-03-04 22:16:37

我是否可以将我想要的任何属性添加到 HTML 标签,以便我可以在以后使用 javascript 检索它们的值?例如:

<a href="something.html" hastooltip="yes" tipcolour="yellow">...</a>

如果这行不通,您将如何存储这样的任意信息?

编辑:由于构成 HTML 属性在技术上似乎无效,因此我已将这个问题的第二部分改写为自己的问题:如何为某些 HTML 标签存储任意数据

4个回答

在 HTML5 中,是的。你只需要在它们前面加上data-. 请参阅规范

当然,这意味着您应该使用 HTML5 文档类型 ( <!doctype html>),即使浏览器并不关心。

@annakata,这个建议有什么不安全的地方?它会打破什么?
2021-04-22 22:16:37
HTML5 仍在草案中,这不是一个安全的建议
2021-05-04 22:16:37
嗯,这个规范是在最终确定之前使用的。wiki.whatwg.org/wiki/...
2021-05-14 22:16:37
不要太担心规范没有最终确定。最终的规范可能会改变/被取代。浏览器可能不会实现该规范。只要确保您为您的用户进行测试,并与网络一起发展!
2021-05-14 22:16:37
除了随意选择属性之外,这不会破坏任何东西,而且它对未来的规范有效,笑个不停!
2021-05-19 22:16:37

好吧,您总是可以创建自己的 DTD 来为您的标签获取新的有效属性。浏览器不会出现问题,如果您可以访问这些自定义属性,您应该测试您的 JavaScript。或者您可以使用 HTML 和 CSS 提供的现有工具。您可以使用多个类,例如

<a href="..." class="class-one class-two has-tooltip">

对于颜色选择,我强烈建议您不要在 HTML 中使用硬编码的颜色名称,您需要使用 CSS 来声明样式。使用 class 属性作为 CSS 声明的钩子,并选择语义类名称,例如

HTML:

<a href="..." class="has-tooltip common-tooltip">
<a href="..." class="has-tooltip long-tooltip">

CSS:

a.has-tooltip {
   colour: red;
}
a.common-tooltip {
   background: #ddd;
}
a.long-tooltip {
   background: #ebf;
}

并且在您的 JavaScript 代码中,您可以生成具有“长工具提示”和“通用工​​具提示”之类的类而不是“黄色工具提示”的元素,因此在重新设计页面以具有绿色工具提示的情况下,您不会自相矛盾。

我给出的例子只是一个例子:我要存储的数据可以是任何东西,而不仅仅是颜色等等。
2021-05-08 22:16:37

你可以。该页面不会通过验证,但大多数浏览器会接受它。

这几乎可以肯定是错误的做法。尝试使用 class="hasTooltip_yes tipcolour_yellow"

你不认为将 class 属性混为一谈是更错误的吗?
2021-04-20 22:16:37
如果你混杂了 class 属性,它仍然会验证,所以在遵守标准方面你仍然会更好。
2021-05-08 22:16:37
仅仅因为您遵守标准,并不意味着您拥有最佳解决方案。
2021-05-08 22:16:37

根据您要存储的信息,您应该查看一些其他可用属性。这些看起来不是很好的候选者,但 'rel' 已被用于许多有趣的事情。

根据规范,rel 属性只能包含 LinkTypes 例如:开始下一章
2021-05-16 22:16:37
但是,规范没有定义链接类型的权威列表,实际上留下了扩展的空间
2021-05-18 22:16:37