Question

为什么在同一页面上拥有多个具有相同id属性的HTML元素是不好的做法？我正在寻找一种方法向不太熟悉HTML的人解释这一点。

我知道HTML规范requires ids to be unique，但这听起来并不是一个令人信服的理由。我为什么要关心某人在某些文件中所写的内容？

我能想到的主要原因是具有相同id的多个元素可能会导致使用Javascript函数（例如document.getElementById）出现奇怪和未定义的行为。我也知道它会导致URL中的片段标识符出现意外行为。任何人都可以想到任何其他对HTML新手有意义的理由吗？

Answer 1

根据您的问题，您已经知道w3c对此有何评价：

id属性指定HTML元素的唯一ID（id   属性值在HTML文档中必须是唯一的。）

id属性可用于指向样式表中的样式。

JavaScript属性也可以由JavaScript使用（通过HTML DOM）   使用特定ID更改HTML元素。

带有id的点是它必须是唯一的。它用于识别一个元素（或任何东西：如果两个学生拥有相同的学生ID，学校会在看起来分开）。它不像人名，不一定是唯一的。如果数组中的两个元素具有相同的索引，或者两个不同的实数相等......那么宇宙就会崩溃。这是身份定义的一部分。

你应该使用类来做你想做的事情，我想（ps：你想做什么？）。

希望这有帮助！

Answer 2

为什么我应该关心某人在某篇文档中所写的内容？

您应该关心，因为如果您正在编写HTML，它将在浏览器中呈现，该浏览器由关心的人编写。 W3C创建了规范，谷歌，Mozilla，微软等......正在关注它，因此您也可以关注它。

Answer 3

除了显而易见的原因（它们应该是唯一的）之外，您应该注意，因为具有相同id的多个元素可能会破坏您的应用程序。

假设你有这个标记：

<p id="my_id">One</p>
<p id="my_id">Two</p>

CSS是宽容的，这会将两个元素都染成红色：

#my_id { color:red; }

..但是使用JavaScript，这只会影响第一个：

document.getElementById('my_id').style.color = 'red';

这只是一个简单的例子。当你使用依赖于id唯一的JavaScript做任何事情时，你的整个应用程序可能会崩溃。这里每天都会发布一些问题，这些问题实际上正在发生 - 由于开发人员使用了重复的id属性，因此关键部分被打破了。

Answer 4

因为如果你有多个具有相同ID的HTML元素，它就不再是一个IDentifier，是吗？

为什么两个人不能拥有相同的社会安全号码？

Answer 5

我能想到的主要原因是具有相同id的多个元素可能会导致document.getElementById等Javascript函数出现奇怪和未定义的行为。

...和依赖于id的XPath表达式，爬虫，抓取器等，但是，确实如此。如果他们不相信，那对他们来说太糟糕了;它最终会咬他们，无论他们是否知道（当他们的网站被访问不当时）。

Answer 6

为什么社会安全号码应该是唯一的，还是车牌号？出于同样的原因，任何其他标识符应该是唯一的。所以它确定了一件事，如果你有id，你可以找到一件事。

Answer 7

你基本上回答了这个问题。我认为只要一个elemenet不再能被id唯一地标识，那么驻留在这个功能上的任何函数都会破坏。您仍然可以选择使用id来搜索xpath样式的元素，就像使用类一样，但它很麻烦，容易出错，以后会让您头疼。

Answer 8

我能想到的主要原因是具有相同的多个元素 id可能会导致Javascript函数出现奇怪和未定义的行为例如document.getElementById。

这正是问题所在。 “未定义的行为”意味着一个用户的浏览器将以一种方式运行（可能仅获取第一个元素），另一个将以另一种方式运行（可能仅获取最后一个元素），而另一个将以另一种方式运行（可能获得所有数组）元件）。编程的整个想法是为计算机（即用户的浏览器）提供有关您希望它执行的操作的准确说明。当您使用非唯一ID属性等模糊指令时，您会得到不可预测的结果，这不是程序员想要的。

为什么我应该关心某人在某篇文档中所写的内容？

W3C规范不仅仅是“某些文件”;它们是规则，如果您遵循编码，您可以合理地期望任何浏览器都遵守。当然，W3C标准很少被所有浏览器严格遵循，但它们是存在的最佳普遍接受的基本规则集。

Answer 9

简短的回答是，在HTML / JavaScript DOM API中，您有getElementById函数，它返回一个元素，而不是集合。因此，如果您有多个具有相同ID的元素，则无法知道要选择哪个元素。

但问题实际上并不是那么愚蠢，因为有理由想要一个可能引用HTML中多个元素的id。例如，用户可能会选择文本并希望对其进行注释。你想用

来表明这一点

<span class="Annotation" id="A01">Bla bla bla</span>

如果用户选择了跨越多个段落的文本，则需要将其分解为片段，但该选择的所有片段都应该由相同的＆＃34; id＆＃34;来寻址。

请注意，过去你可以放

<a name="..."/>

HTML中的

元素，您可以使用getElementsByName找到它们。所以这是类似的。但不幸的是，HTML规范已经开始弃用这个，这是一个坏主意，因为它留下了一个重要的用例而没有一个简单的解决方案。

当然，使用XPath，您可以使用任何属性甚至文本节点作为id。显然，XPointer规范允许您通过任何XPath表达式引用元素，并在URL片段引用中使用它，如

http://my.host.com/document.html#xpointer(id('A01'))

或其简短版本

http://my.host.com/document.html#A01

或其他等效的XPath表达式：

http://my.host.com/document.html#xpointer(/*/descendant-or-self::*[@id = 'A01'])

等等，可以引用名称属性

http://my.host.com/document.html#xpointer(/*/descendant-or-self::*[@name = 'A01'])

或您为属性命名的任何内容

http://my.host.com/document.html#xpointer(/*/descendant-or-self::*[@annotation-id = 'A01'])

希望这有帮助。

为什么拥有多个具有相同id属性的HTML元素是一件坏事？

9 个答案: