我有一个奇怪的问题.
但是,我想知道当我在html 5上使用无效属性时会发生什么?
例如,如果我想在标签上添加attr'City'.
<div data-city="etc"></div>
Run Code Online (Sandbox Code Playgroud)
是有效的方式.
但是,用这种方式完美地工作
<div city="etc"></div>
Run Code Online (Sandbox Code Playgroud)
我想知道是什么结果,我不应该使用'city',而不是'data-city'?
如果仅用于传递javascrpit的数据,我一般只能使用"城市"吗?
非常感谢您的建议.
HTML 4.01规范在其关于无效文档的注释中建议,如果浏览器"遇到它无法识别的属性,它应该忽略整个属性规范(即属性及其值)"和"提供[s]支持用于通知用户此类错误".
实际上,只要考虑HTML,浏览器就会忽略未知属性.但是,他们不会在CSS中忽略它们; [city]在现代浏览器中,属性选择器与元素匹配.并且它们不会在JavaScript中忽略它们,但是它们与符合属性的区别对待city不会成为元素节点的属性,但它成为属性的attributes属性,因此可以通过getAttribute和setAttribute方法使用它们.
此类处理违反了HTML 4.01规范,并且无法保证它将在所有浏览器上发生.HTML5草案似乎没有解决这个问题:它们指定了处理解析错误和过时功能的规则,但没有指定未定义的属性.
此外,有些日子某些未来的规范或某些浏览器可能会开始将其识别city为属性名称,可能会以与您的想法严重冲突的方式.使用一个神秘的名字可能会使这种冲突的可能性非常小.但是使用data-city避免了这个问题,因为data-*属性是针对特定于站点的扩展,并且保证永远不会与任何标准属性冲突.
不幸的是,这是不正确的。然而,所有(现代)浏览器都可以接受这一点(只要能够显示它并将其保留在 DOM 中),因为它们努力与所有(甚至是糟糕的)HTML 代码兼容,但这不会是一个真实属性。您的代码不会被验证为真正的 W3 规范 HTML 5 代码,但它应该仍然可以工作。
如果您需要使用“城市”,您可能需要使用 XHTML,您可以在其中为您自己的元素指定您自己的属性。