全选，取消全选，反选按钮

看书：<input type="checkbox" name="checkbox" value=1><br>
写字：<input type="checkbox" name="checkbox"value=2><br>
打飞机：<input type="checkbox" name="checkbox"value=3><br>
玩游戏：<input type="checkbox" name="checkbox"value=4><br>
<button onclick="allcheck()">全选/取消</button>

var checkAll = false;
function allcheck(){
    checkAll = !checkAll;
    let inputs = document.getElementsByName('checkbox')
    for(var i =0;i<inputs.length;i++){inputs[i].checked = checkAll}
}

 

 

 这么写如果手动勾选全部，再点按钮则需要点两下，另一写法可以避免：

function allcheck(){
    var checkFlag = false;    //默认执行的操作是取消全选
    var inputs = document.getElementsByName('checkbox');
    for(var i = 0; i < inputs.length; i++) {
        if(!inputs[i].checked) {    //如果存在未勾选的状态则要做的是全选
            checkFlag = true;
            break;    //可加可不加，加了可能能减少遍历的时间，不加也不会对结果有影响
        }
    }
    for(var i = 0; i < inputs.length; i++) {
        inputs[i].checked = checkFlag;
    }
}