html - 使用属性 'for' 链接自定义元素

Question

我创建了一个 jQuery 插件，可以像这样转换 HTML 表单

<form>
    <input type="checkbox" id="checkbox_01" value="1"/>
    <label for="chexkbox_01"></label>
</form>

变成这样的形式:

<form>
    <input type="checkbox" id="checkbox_01" value="1" aria-hidden="true" />
    <span role="checkbox" id="aria-checkbox_01" aria-checked="false" tabindex="0"></span>
    <label for="aria-chexkbox_01"></label>
<form>

更改 for 属性以链接自定义元素是否有效？

Answer 1

没有。

If the attribute is specified, the attribute's value must be the ID of a labelable element in the same Document as the label element.

— https://www.w3.org/TR/html5/forms.html#attr-label-for

Some elements, not all of them form-associated, are categorized as labelable elements. These are elements that can be associated with a label element.

button input (if the type attribute is not in the hidden state) keygen meter output progress select textarea

— https://www.w3.org/TR/html5/forms.html#category-label

跨度不是可标记元素。