摘要：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <style> .box{height: 250px;width: 150px;border: 1px solid #ccc;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style>
.box{height: 250px;width: 150px;border: 1px solid #ccc;/*margin: 0px auto;*/}
.box input{margin: 5px 15px;}
.box .box1{border-bottom: 1px solid #ccc; margin: 15px 0;}
</style>
<body>
<div class="box">
<div class="box1">
<input type="checkbox" id="checkall" onclick="checkall()"/>全选<br />
<input type="checkbox" id="inverse" onclick="inverse()"/>反选
</div>
<input type="checkbox" name="item"/>选项1<br />
<input type="checkbox" name="item"/>选项2<br />
<input type="checkbox" name="item"/>选项3<br />
<input type="checkbox" name="item"/>选项4<br />
<input type="checkbox" name="item"/>选项5<br />
<input type="checkbox" name="item"/>选项6<br />
<input type="checkbox" name="item"/>选项7
</div>
</body>
<script>
//全选
function checkall(){
var checkall = document.getElementById("checkall");
var item = document.getElementsByName("item")
for(i=0;i<=item.length;i++){ //获取选项的长度
if(checkall.checked){
item[i].checked = true;
}else{
item[i].checked = false
}
}
}
//反选
function inverse(){
var item = document.getElementsByName("item")
for(i=0;i<=item.length;i++){
if(item[i].checked == false){
item[i].checked = true;
}else{
item[i].checked = false
}
}
}
</script>
</html>
通过item.length获取选项的长度，找出所有item选项，当全选框选中时，遍历所有item并将它们选中，item.length=true，当全选框没选中时相反，反选也一样，其中item.checked==false时犯了一个错，写成item.checked=false，导致反选结果返回的都是else的结果，加深理解 =是赋值，==是等于
批改老师：灭绝师太批改时间：2018-11-07 16:31:54
老师总结：嗯，有时候犯点错误好呢，加深记忆，理解的不错继续加油
