<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> JS实现全选和反选</title>
</head>
<script>
window.οnlοad=function(){
var btns =document.getElementById('checkItem').children;
var inps =document.getElementById('content').children;
function check(e){
for(var i=0;i<inps.length;i++){
inps[i].checked=e;
}
};
btns[0].οnclick=function(){
check(true)
}
btns[1].οnclick=function(){
check(false)
}
btns[2].οnclick=function(){
for(var i=0;i<inps.length;i++){
if(inps[i].checked==true){
inps[i].checked=false
}else{
inps[i].checked=true
}
// inps[i].checked==true ? inps[i].checked=false:inps[i].checked=true;
}
}
}
</script>
<body>
<div id='checkItem'>
<input type="button" value="全选" />
<input type='button' value="取消" />
<input type='button' value="反选"/>
</div>
<div id="content">
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
<input type="checkbox" name="">xxxxx
</div>
</body>
</html>