需求：
1.当all选项勾选时，所有选项都被勾选，反正当所有选项被选中时，全选选项自动选中
2.点击反选按钮时，被选中的选项取消选中，未被选中的选项被选中
Html结构
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
all<input id="all" type="checkbox" onclick="check()">
<button type="button" onclick="fanx()">反选</button>
首先，我们得到我们要控制的元素，并且用for循环给每个checkbox绑定点击事件：
var all=document.getElementById("all")
var box=document.getElementsByTagName("input") //此处选中了所有的input,包括全选按钮本身，在后面的操作中需要注意
for (i = 0; i < box.length-1; i++) {
box[i].onclick = onclike
}
1.全选
分析：我们让每个checkbox的checked属性都等于全选的checked属性，则可实现全选和全不选的操作，代码如下：
function check() {
for (i = 0; i < box.length-1; i++) {
box[i].checked = all.checked
}
}
2.反向全选
分析：
方案一：通过变量j来计算有多少选项被选中，如果被选中的个数等于总个数，则全选的checked属性为true，代码如下：
function onclike() {
var j=0
for (i = 0; i < box.length - 1; i++) {
if (box[i].checked) {
j++
}
}
all.checked=(j==box.length-1)
/*if(j==box.length-1)
{
all.checked=true
}
else
{
all.checked=false
}*/
}
方案二：只要有一个选项未被选择中，则全选属性为false,通过逻辑与的方式将每个选项的布尔值与之前比较，代码如下：
function onclike()
{
var flag=true
for (i = 0; i < box.length - 1; i++) {
var ifChecke = box[i].checked
flag = flag && ifChecke
}
all.checked=flag
}
3.反选
分析：当checked为true为真时，使其为false,否则为true,代码如下：
function fanx(){
for (i = 0; i < box.length-1; i++)
{
if(box[i].checked){
box[i].checked=false
}
else
{
box[i].checked=true
}
}
}
————————————————————————————————————————————————————————————————————————————
完整代码
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
all<input id="all" type="checkbox" onclick="check()">
<button type="button" onclick="fanx()">反选</button>
</body>
<script type="text/javascript">
var all=document.getElementById("all")
var box=document.getElementsByTagName("input")
for (i = 0; i < box.length-1; i++) {
box[i].onclick = onclike
}
//通过变量j来计算有多少选项被选中，如果被选中的个数等于总个数，则全选的checked属性为true
function onclike2() {
var j=0
for (i = 0; i < box.length - 1; i++) {
if (box[i].checked) {
j++
}
}
all.checked=(j==box.length-1)
/*if(j==box.length-1)
{
all.checked=true
}
else
{
all.checked=false
}*/
}
//只要有一个选项未被选择中，则全选属性为false,通过逻辑与的方式将每个选项的布尔值与之前比较
function onclike()
{
var flag=true
for (i = 0; i < box.length - 1; i++) {
var ifChecke = box[i].checked
flag = flag && ifChecke
}
all.checked=flag
}
function check() {
for (i = 0; i < box.length-1; i++) {
box[i].checked = all.checked
}
}
function fanx(){
for (i = 0; i < box.length-1; i++)
{
if(box[i].checked){
box[i].checked=false
}
else
{
box[i].checked=true
}
}
}
</script>
</html>