HTML 标记中的“ for”属性有什么作用？

Question

我想知道以下两个代码段之间的区别是什么：

<label>Input here : </label>
<input type='text' name='theinput' id='theinput'/>

和

<label for='theinput'>Input here : </label>
<input type='text' name='theinput' id='theinput'/>

我确定当您使用特殊的JavaScript库时，它会执行某些操作，但是除此之外，它是否可以验证HTML或出于其他原因而需要？

Answer 1

该<label>标签可让您单击标签，它会像点击相关的输入元素上进行处理。有两种创建此关联的方法：

一种方法是将label元素包装在input元素周围：

<label>Input here:
    <input type='text' name='theinput' id='theinput'>
</label>

另一种方法是使用for属性，为其提供关联输入的ID：

<label for="theinput">Input here:</label>
<input type='text' name='whatever' id='theinput'>

这对于与复选框和按钮一起使用特别有用，因为这意味着您可以通过单击关联的文本来选中该框，而不必自己点击该框。