label标签和其它表单元素的搭配使用

        在web前端开发中，当一个checkBox表单元素和一段文字搭配使用时

                例如：<input type="checkbox" id="all-select"> 全选

我们通常都需要实现点击文字("全选")达到选中效果，第一想法肯定是使用JS来控制，写一堆的代码实现(这仅代表我个人想法)，但通过我的同事指导，我学习到了还有一种更快捷的方法实现，也就是通过  label  标签来实现

1.当文字和表单元素在同一级别下时，我们可以直接使用  label  标签把它们包括起来就可以实现效果

  例如：   <label>  <input type="checkbox" id="all-select"> 全选  </label>

2.当文字与控件元素不在同一级别下时，我们只要用  label  标签把文字包括起来，关键是对  label 标签的 for  属性进行指定，for  属性的值就是你需要控制的表单元素的ID

  例如：<ul>

    <li> <input type="checkbox" id="all-select"></li>

    <li><label for="all-select" >全选</label></li>

    </ul>

以上两种都可以实现点击文字达到选中效果