JS实现表单的全选与取消

点击全选复选框时，全部的复选框都被选中；当复选框都被手动选中时，上面的全选复选框自动被选中

代码如下：

 <table>
        <thead>
            <tr>
                <td>
                    <input type="checkbox" id="checkAll">
                </td>
                <td>商品名字</td>
                <td>价格</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <input type="checkbox" name="" id="">
                </td>
                <td>华为 mate xs</td>
                <td>19000</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" name="" id="">
                </td>
                <td>华为 mate xs</td>
                <td>19000</td>
            </tr>
        </tbody>
    </table>
    <script>
     var checkAllEle = document.getElementById("checkAll");
        var tbEle = document.querySelector("tbody").querySelectorAll("input");
        checkAllEle.onclick = function () {
            var a = this.checked;
            for (var i = 0; i < tbEle.length; i++) {
                tbEle[i].checked = a;
            }
        }
        for (var j = 0; j < tbEle.length; j++) {
            tbEle[j].onclick = function () {
                var flag = false;
               for (var i = 0; i < tbEle.length; i++) {
                    if (tbEle[i].checked === !flag) {
                        checkAllEle.checked = true;
                    }
                    if (tbEle[i].checked === flag) {
                        checkAllEle.checked = false;
                    }
                }
            }
        }
    </script>