我知道在HTML/XHTML页面中id必须是唯一的。
对于一个给定的元素，我可以给它分配多个id吗?
<div id="nested_element_123 task_123"></div>
我意识到我有一个简单的解决方案，只需使用一个类。我只是好奇以这种方式使用id。
这很有趣，但据我所知，答案肯定是否定的。我不明白为什么您需要一个嵌套ID，因为您通常会与具有相同嵌套ID的另一个元素交叉。如果你不做，那就没有意义，如果你做了，那也没什么意义。
不。来自XHTML 1.0规范
In XML, fragment identifiers are of type ID, and there can only be a single attribute of type ID per element. Therefore, in XHTML 1.0 the id attribute is defined to be of type ID. In order to ensure that XHTML 1.0 documents are well-structured XML documents, XHTML 1.0 documents MUST use the id attribute when defining fragment identifiers on the elements listed above. See the HTML Compatibility Guidelines for information on ensuring such anchors are backward compatible when serving XHTML documents as media type text/html.
不。虽然W3C对HTML 4的定义似乎没有明确地涵盖您的问题，但name和id属性的定义表明标识符中没有空格:
ID和NAME令牌必须以字母([a- za -z])开头，后面可以是任意数量的字母、数字([0-9])、连字符("-")、下划线("_")、冒号(":")和句号(".")。
不。每个DOM元素(如果它有id)都有一个唯一的id。你可以用以下方法来近似:
<div id='enclosing_id_123'><span id='enclosed_id_123'></span></div>
然后使用导航来得到你真正想要的东西。
如果你只是想应用样式，类名会更好。
我的理解一直是:
id是一次性使用的，只应用于一个元素… 每个元素都作为唯一标识符归属于(仅)一个元素。 类可以使用不止一次… 因此，它们可以应用于多个元素，类似但不同的是，每个元素可以有多个类(即多个类)。
不，如果你想沿着那条路径走，你应该使用嵌套的div。此外，即使您可以，想象一下当您运行document.getElementByID()时它会引起的混乱。如果有多个ID，它会抓取哪个ID ?
在稍微相关的主题中，您可以向DIV中添加多个类。
http://meyerweb.com/eric/articles/webrev/199802a.html
每个元素只能有一个ID，但确实可以有多个类。但不要有多个类属性;将多个类值放入一个属性中。
<div id="foo" class="bar baz bax">
完全合法。
正如其他人在我之前说过的那样，简单的答案是否定的。一个元素不能有多个ID，一个ID在一个页面中不能使用多次。试一试，你就会发现它有多不管用。
针对tvanfosson关于在两个不同元素中使用相同ID的回答。据我所知，一个ID在一个页面中只能使用一次，不管它是否附加到不同的标记。
根据定义，需要ID的元素应该是唯一的，但如果需要两个ID，那么它就不是唯一的，而是需要一个类。
I don´t think you can have two Id´s but it should be possible. Using the same id twice is a different case... like two people using the same passport. However one person could have multiple passports... Came looking for this since I have a situation where a single employee can have several functions. Say "sysadm" and "team coordinator" having the id="sysadm teamcoordinator" would let me reference them from other pages so that employees.html#sysadm and employees.html#teamcoordinator would lead to the same place... One day somebody else might take over the team coordinator function while the sysadm remains the sysadm... then I only have to change the ids on the employees.html page ... but like I said - it doesn´t work :(
与别人说的相反，正确的答案是肯定的
Selectors规范对此非常清楚:
如果一个元素有多个ID属性，为了ID选择器的目的，所有这些属性都必须被视为该元素的ID。这种情况可以混合使用xml:id、DOM3 Core、xml dtd和特定于名称空间的知识来实现。
Edit
澄清一下:是的，一个XHTML元素可以有多个id，例如:
<p id="foo" xml:id="bar">
但是使用空格分隔的列表将多个id分配给同一个id属性是不可能的。
我想说技术上是可以的，因为真正呈现的内容在技术上总是依赖于浏览器。大多数浏览器都尽可能地遵循规范，据我所知，CSS规范中并没有反对这一点。我只担保在任何其他解释器介入之前发送到浏览器的实际HTML、CSS和JavaScript代码。
然而，我也说不，因为我通常测试的每个浏览器实际上都不允许您这样做。
如果您需要自己查看，请将以下文件保存为.html文件，并在主要浏览器中打开它。在我测试的所有浏览器中，JavaScript函数都不能与元素匹配。然而，从id标签中删除任何一个“hunkojunk”都可以正常工作。
示例代码
<html>
<head>
</head>
<body>
<p id="hunkojunk1 hunkojunk2"></p>
<script type="text/javascript">
document.getElementById('hunkojunk2').innerHTML = "JUNK JUNK JUNK JUNK JUNK JUNK";
</script>
</body>
</html>
从7.5.2元素标识符:id和class属性:
id属性为元素赋值唯一标识符 由SGML解析器验证)。
and
ID和NAME标记必须以字母([a- za -z])开头，并且可以是 后面跟着任意数量的字母，数字([0-9])，连字符(“-”)， 下划线(“_”),冒号(“:”)和时间(“。”)。
所以“id”必须是唯一的，不能包含空格。
这是专门的课程，而且 下面是你可以理解它的代码:
<html>
<head>
<style type="text/css">
.personal{
height:100px;
width: 100px;
}
.fam{
border: 2px solid #ccc;
}
.x{
background-color:#ccc;
}
</style>
</head>
<body>
<div class="personal fam x"></div>
</body>
</html>
No.
话虽如此，没有什么能阻止你这么做。但是不同的浏览器会产生不一致的行为。不要这样做。每个元素一个ID。
如果需要对一个元素进行多个赋值，请使用classes(用空格分隔)。
Nay.
从3.2.3.1的id属性:
不能包含空格。
id="a b" <——查找该VaLuE中的空格字符。
也就是说，可以对多个id进行样式化。但如果您遵循规范，答案是否定的。
任何分配给div元素的ID都是唯一的。 但是，你可以在一个div元素下分配多个id，而不是“分配给”一个div元素。 在这种情况下，您必须将这些id表示为<span></span> IDs。
例如，您希望同一HTML页面中的两个链接指向页面中的相同div元素。
这两个不同的链接
<p><a href="#exponentialEquationsCalculator">Exponential Equations</a></p>
<p><a href="#logarithmicExpressionsCalculator"><Logarithmic Expressions</a></p>
指向页面的同一部分
<!-- Exponential / Logarithmic Equations Calculator -->
<div class="w3-container w3-card white w3-margin-bottom">
<span id="exponentialEquationsCalculator"></span>
<span id="logarithmicEquationsCalculator"></span>
</div>
推荐文章
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 下一个元素的CSS选择器语法是什么?
- 我如何用CSS跨浏览器绘制垂直文本?
- 如何获得box-shadow在左侧和右侧
- 相对定位一个元素，而不占用文档流中的空间
- 如何在jQuery检索复选框值
- 禁用身体滚动
- 如何在删除前显示确认消息?
- 在一个CSS宽度的小数点后的位置是尊重?
- 我怎么能选择一个特定的类的最后一个元素，而不是父里面的最后一个孩子?
- 反应:为什么当道具改变时子组件不更新
- 我怎么能检查html元素，从DOM消失失去焦点?
- 在Atom编辑器中是否有格式化HTML的命令?
- 把<script>标签放在</body>标签之后是错误的吗?
- 谷歌Chrome表单自动填充和它的黄色背景
