同一HTML文档中有多个相同的ID

Question

我正在创建一个包含多个可能包含ID的HTML模板的网页。因此，最终页面可能包含多个HTML元素，这些HTML元素具有HTML不允许的完全相同的ID

我似乎仍然可以使用jQuery上下文来解决这个问题，例如：$（“＃id54”，template4），但是这总是适用于所有浏览器，还是某些浏览器会拒绝我多个ID？

Answer 1

$(selector, context)语法将始终只在给定的上下文中进行搜索，因此只要您的ID在该上下文中是唯一的，您的jQuery就可以在所有浏览器中使用。

但是，正如您所知，在模板中以这种方式使用ID是不明智的。

由于不允许使用多个相同的ID，因此没有规定应如何处理它们。永远不能保证所有浏览器都会继续支持您正在编写的代码。不过，该代码的行为与您今天在所有主流浏览器上的预期相同。

变通方法将使用模板引擎中的类或逻辑来确保唯一ID，例如 templateID控制-2- myButton的

Answer 2

只要您使用jQuery上下文，例如$('#some-id', context)，它会正常工作。

但是对于在页面中出现多次的元素，你应该使用类名而不是ID。

Answer 3

没有浏览器会拒绝您多个ID，但这是不好的做法。 “ID”标记是文档对象模型（DOM）中对象的唯一标识符。如果你的目标是使用带有这些ID的jQuery，你需要提出另一种解决方案。 注意：您的代码仍然可以正常运行，并且会在每个浏览器中呈现。如果您一直在查询它并且它们都具有相同的ID，那么就会对DOM施加更大的压力！ （另外，不太可维护）

如果您需要每个模板具有相同的ID，请考虑使用类（即.template）或甚至自定义属性（即<div class="something" mycustomid="1">然后使用$（。something）.attr（'mycustomid '）访问它。（注意：W3C HTML Validator不验证这一点）

如果你真的坚持使用ID，但是想要更好地编写代码，请尝试在id的开头添加一些独特的东西（如果模板是以这种方式创建的，甚至是迭代器的索引），然后使用jQuery来做正则表达式匹配。

这不是一个答案，但我没有足够的信息:)