用于属性澄清的HTML5标签

时间:2015-07-05 12:15:04

标签: html5

来自HTML5最终规范(http://www.w3.org/TR/html5/forms.html#attr-label-for)的引用:

  

可以指定for属性以指示与标题相关联的表单控件。如果指定了该属性,则属性的值必须是与标签元素位于同一Document中的ID的{​​{1}}。如果指定了属性并且文档中有labelable element等于ID属性值的元素,则并且第一个此类元素为{{1然后,该元素是标签元素的标记控件。

最后一句话措辞奇怪:它在单个元素中讨论“第一个这样的元素”并且似乎暗示在具有相同ID的文档中可以存在多个元素。粗体部分是否应该被理解为“和那个元素”?

EDIT。回答我的问题的人似乎相信规范正在定义一个行为,以防其中一个规范规则(唯一ID)被破坏。这对我来说听起来完全不可信。如果你违反了规范中的规则,那么你将面临自己的危险并获得未定义的行为。我从来没有看到过这样的规范:这是规则,但是如果你打破它,不要担心,事情仍然可以这样工作。

4 个答案:

答案 0 :(得分:2)

我不为作者说话,但我认为它本来应该按原样阅读。

  

如果指定了属性并且Document中有一个元素,其ID等于for属性的值,并且第一个这样的元素labelable元素,那么该元素是标签元素的标记控件。

请注意,我强调了第一个这样的元素。考虑一个有两种形式的场景。有两种input可能有不同形式的id label。您可以使用两个label来表示每个输入。该规范的含义是forinput第一个id,文档中匹配label。换句话说,如果您有两组for=elm inputfor=elm label,则input都将指向<{1}} strong>第一个input

看看这个:http://jsfiddle.net/Lxg5rrk6/2/

此外,我强烈建议您不要在同一页面中使用相同id代表两个Post,但现在可能会明白它会破坏您的页。

答案 1 :(得分:1)

它解决了这样一个事实:虽然应该只是一个具有唯一ID的元素,但可能有更多,无论是设计还是错误。在这种情况下,标签仅适用于第一个标签。

注意: 我完全改写了这个答案。我最初假设了&#34;控制阵列&#34;仅适用于现已折旧的VBScript引擎。经过进一步调查,我发现JavaScript仍然支持它们。

&#34;控制阵列&#34;有一个记录很少且不支持的概念。通过为控件提供相同的ID来创建。然后对它们进行区分并将其作为ID [0],ID [1]等进行寻址。请注意,JavaScript代码不使用:

theDivs[0]...

如果有,请求将遵循规范并仅返回第一个元素。相反,元素直接表示为:

window.onload = function() {
  theDivs[0].style.backgroundColor = "blue";
  theDivs[1].style.backgroundColor = "red";
  theDivs[2].style.backgroundColor = "green";
}

运行以下代码片段,了解如何在JavaScript中处理三个具有相同名称的DIV,并且还应用了CSS。

重要提示:我不是在暗示应该使用这种技术。此处的信息仅用于说明HTML规范未明确禁止多次使用同一ID的一个原因。

&#13;
&#13;
#theDivs {
  color: white;
  margin: 0 auto 10px;
  text-align: center;
  width: 250px;
}
&#13;
<body>
  <div id="theDivs">I'm the 1st div with ID = "theDivs"</div>
  <div id="theDivs">I'm the 2nd div with ID = "theDivs"</div>
  <div id="theDivs">I'm the 3rd div with ID = "theDivs"</div>
</body>
&#13;
SELECT User.username, User.ID, Count(Log.id) LogCount
FROM users User 
LEFT JOIN logs Log
    ON User.ID = Log.id
GROUP BY User.ID, User.username
ORDER BY LogCount DESC
LIMIT 10
&#13;
&#13;
&#13;

答案 2 :(得分:1)

似乎HTML5规范中引用的短语没有拼写错误,并且确实在其他规范规则之一(ID必须唯一)被破坏时定义了一种行为。以下是另一个W3C规范(W3C DOM4)的引用,其中的方式再次考虑了文档中存在重复ID的元素的存在(注意以粗体显示的部分):

http://www.w3.org/TR/dom/#dom-nonelementparentnode-getelementbyid

  

getElementById(elementId)方法必须以树的顺序在上下文对象的后代中返回第一个元素,其ID为elementId,如果没有这样的元素,则返回null

W3C认为有必要在一个规范规则(ID必须是唯一的)被破坏的情况下定义行为的原因仍然是个谜。

答案 3 :(得分:0)

这对我有意义,但这是解释;

由于for属性链接到id而不是class,因此它只会检测其类型的第一个id

这就是我所定义的预期行为,因为任何页面都应该只有一个带有id名称的元素 - 如果你需要多个具有相同标识名称的元素,请使用{ {1}}。

总之,class将始终链接到指定了id的第一个元素。

快速的JS小提琴;

http://jsfiddle.net/5fz19n64/1/

您会注意到它始终将重点放在for字段上。