其实很简单，先分析一下
效果分析：
1，点击全选/全不选
全选文字变成全不选，同时全选按钮和所有按钮选中状态，否则，则相反
2，点击反选按钮
没有选中的按钮变成选中状态，选中的按钮变成未选中
实现方式：
1，点击全选复选框
判断点击的按钮是否为选中状态this.checked = true/false;
true：设置所有复选框为选中状态
false：设置所有复选框为未选中状态
根据为true/false改变点击按钮的文字
2，点击反选
对所有复选框进行遍历，判断每一个复选框是否是选中状态input[i].checked = true/false;
true：设置选中状态的为未选中状态
false：设置未选中状态的为选中状态
<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>复选框（checkbox）全选/全不选/反选</title><style>dl {width: 300px;margin: 30px auto;}dd {margin: 10px;}</style></head><body><center>1、切换全选/全不选文字；2、根据选中个数更新全选框状态；</center><dl><dt><label for="checkall"> <input type="checkbox" id="checkall"><span>全选</span></label><label for="invertcheckall"> <input type="checkbox" id="invertcheckall">反选</label></dt><dd><input type="checkbox" class="item">选项（1） </dd><dd><input type="checkbox" class="item">选项（2） </dd><dd><input type="checkbox" class="item">选项（3） </dd><dd><input type="checkbox" class="item">选项（4） </dd><dd><input type="checkbox" class="item">选项（5） </dd><dd><input type="checkbox" class="item">选项（6） </dd><dd><input type="checkbox" class="item">选项（7） </dd><dd><input type="checkbox" class="item">选项（8） </dd><dd><input type="checkbox" class="item">选项（9） </dd></dl><script type="text/javascript">var all = document.getElementById('checkall');var invertBtn = document.getElementById('invertcheckall');var input = document.querySelectorAll('.item');var select = document.querySelector('span');// 全选function selectAll() {for (var i = 0; i < input.length; i++) {input[i].checked = true;}}// 全不选function notSelectAll() {for (var i = 0; i < input.length; i++) {input[i].checked = false;}}// 反选function invertCheck() {for (var i = 0; i < input.length; i++) {if (input[i].checked == false) {input[i].checked = true;} else {input[i].checked = false;}}}// 点击全选后，文字变成全不选，同时全部复选框选中，以此反复all.addEventListener('click', function () {all.checked == false ? select.innerHTML = "全选" : select.innerHTML = "全不选";if (all.checked == true) {selectAll()} else {notSelectAll()}})// 反选，即点击后原本没有选中选中，选中的取消选中invertBtn.addEventListener('click', function () {invertCheck()})</script></body></html>
