标签只能引用输入元素吗?
W3Schools 对于标签有这样的说法:
标签定义 input 元素的标签。 [强调我的]
这是否意味着以下 HTML 无效?
<!doctype html>
<html>
<head>
<title>Example document</title>
</head>
<body>
<label for="x">Label</label>
<hr>
<div id="q" contentEditable="true">Hello</div>
<hr>
<div id="x" contentEditable="true">World</div>
</body>
</html>
当单击 Label
时,Chrome 和 IE8 都会将焦点放在 World
上,而 Firefox 不会。 哪个是对的?
W3Schools have this to say about labels:
The
<label>
tag defines a label for an input element.
[Emphasis mine]
Does this mean that the following HTML isn't valid?
<!doctype html>
<html>
<head>
<title>Example document</title>
</head>
<body>
<label for="x">Label</label>
<hr>
<div id="q" contentEditable="true">Hello</div>
<hr>
<div id="x" contentEditable="true">World</div>
</body>
</html>
Both Chrome and IE8 give focus to World
when Label
is clicked, Firefox does not.
Which is correct?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
根据 W3C 它适用于表单控件和表单控件定义为:
因此,FireFox 在技术上是正确的,尽管如果浏览器不将其限制为这些元素,我几乎不会认为它是“破坏性的”。
According to the W3C it applies to Form Controls, and Form Controls are defined as:
So FireFox is technically right, although I'd hardly consider it to be "breaking" if a browser didn't restrict it to those elements.
HTML 规范规定,关于
label
的“for”属性,“当存在时,该属性的值必须与同一文档中其他控件的 id 属性的值相同。当不存在时,所定义的标签与元素的内容相关联。”所以“for”中的 id 引用应该是一个控件的引用。 什么是控制? 该规范基本上规定任何
input
都是控件,button
、select
或object
也是如此。 所以 Firefox 从技术上来说是正确的——div
不是一个控件。The HTML spec says, about
label
's "for" attribute, "When present, the value of this attribute must be the same as the value of the id attribute of some other control in the same document. When absent, the label being defined is associated with the element's contents."So the id references in "for" should be that of a control. What's a control? The spec basically says any
input
is a control, as isbutton
,select
, orobject
. So Firefox is technically right -- adiv
is not a control.我想说这不是标记的适当使用,因为标签语义是它们专门用于控件。
http://www.w3.org /TR/html401/interact/forms.html#h-17.9.1
I would say it was not an appropriate use of the markup, because label semantics are that they are specifically for controls.
http://www.w3.org/TR/html401/interact/forms.html#h-17.9.1
最新的 WhatWG 规范是这样说的:
(来源:https://html.spec.whatwg.org/multipage/forms.html 。)
换句话说,该标准只允许
for
属性指向上面列出的 7 种标记类型之一的元素。 因此,在当前规范下,问题中显示的 HTML(使用for
元素指向可编辑的div
)在技术上是无效的 HTML。Nu Html 检查器(即 由 WhatWG 认可)同意; 如果你要求它验证问题中的 HTML 文档,它会说:
The latest WhatWG spec has this to say:
(Source: https://html.spec.whatwg.org/multipage/forms.html.)
In other words, the standard only allows
for
attributes to point at elements of one of the 7 tag types listed above. The HTML exhibited in the question (which uses afor
element to point to an editablediv
) is therefore technically invalid HTML under the current spec.The Nu Html Checker (which is endorsed by WhatWG) agrees; if you ask it to validate the HTML document from the question, it will say: