关于label的两种用法和踩过的坑

label有两种用法

1. label元素使用for属性值和需要关联的元素的id的值设置相同

代码块

<input class="radio" type="radio" name="power" id="one"><label for="one">管理员</label>
<input class="radio" type="radio" name="power" id="two"><label for="two">医生</label>
<input class="radio" type="radio" name="power" id="thr"><label for="thr">患者</label>

2.lable元素直接包住需要关联的值和引申的文本

<label><input class="radio" type="radio" name="power">管理员</label>
<label><input class="radio" type="radio" name="power">医生</label>
<label><input class="radio" type="radio" name="power">患者</label>

3.踩的坑

因为使用的编辑器默认情况下打出的label附带了for属性，但值是空的，就下面这样

<label for=""><label>

所以我刚开使用label包input时，是这样写的，但是完全没效果

<labe for=""><input class="radio" type="radio" name="power">管理员</label>

最后才发现只要写了for属性虽然没有值，依然不符合第二种方法的规范
后来又试了几次,逐步减少for=""这几个字符
发现

<label for=><input class="radio" type="radio" name="power">管理员</label> <!--行不通-->
<label for><input class="radio" type="radio" name="power">管理员</label> <!--行不通-->
<label fo><input class="radio" type="radio" name="power">管理员</label> <!--行得通-->
<label "for"><input class="radio" type="radio" name="power">管理员</label> <!--行得通-->
<label forhaha><input class="radio" type="radio" name="power">管理员</label> <!--行得通-->
<label for haha><input class="radio" type="radio" name="power">管理员</label> <!--行不通-->

如果有非字符串形式的for这三个字母，且for三个字母独立一个整体，就不符合第二种方法的规范