表单元素的操作

思路：

获取全选复选框，为其绑定单击事件。

1.获取全选复选框的选中状态：元素.checked属性 2.获取下面三个复选框：querySeletorAll>>伪数组 3.比那里三个复选框，为每个复选框设置checked属性值

<input type="checkbox" name="" id="" class="chkAll">全选
   <div class="list">
       <input type="checkbox" name="" id="">吃饭
       <input type="checkbox" name="" id="">睡觉
       <input type="checkbox" name="" id="">敲代码
   </div>

        let chkAll = document.querySelector('.chkAll')
        //获取全选按钮的复选框
        let chks = document.querySelectorAll('.list > input')
        //获取div下所有复选框
        console.log(chks);//打印输出NodeList(3)
        //为全选框按钮添加点击事件
        chkAll.onclick = function(){
           //获取全选按钮状态值，选中就为true否则就是false
            let start = chkAll.checked
            //遍历下面所有的复选框,为设置每个checked的值
            for (let i = 0; i < chks.length; i++) {
              console.log(chks[i].checked);
              //把全选复选框的状态值赋值给list下的所有复选框
               chks[i].checked=start 
            }
        }

效果图：