<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title></title> <script type="text/javascript"> window.onload=function(){ var allSelect=document.getElementById("allSelect"); var noSelect=document.getElementById("noSelect"); var btn2=document.getElementById("btn2"); // 获取所有的input标签 var oDiv=document.getElementById("chk"); var chks=oDiv.getElementsByTagName("input"); allSelect.onclick=function(){ for(var i=0;i<chks.length;i++){ chks[i].checked=true; // 全部选中 } }; noSelect.onclick=function(){ // 全不选 for(var i=0;i<chks.length;i++){ chks[i].checked=false; } }; btn2.onclick=function(){ for(var i=0;i<chks.length;i++){ // 进行反选 chks[i].checked=!chks[i].checked; } };
};
</script>
</head> <body> <div id="top">
</div>
<div id="container">
<input type="button" value="全选" id="allSelect">
<input type="button" value="反选" id="btn2">
<input type="button" value="不选" id="noSelect">
<hr size="5" color="white">
<div id="chk">
<input type="checkBox">篮球
<br>
<input type="checkBox">羽毛球
<br>
<input type="checkBox">乒乓球
<br>
<input type="checkBox">足球
<br>
<input type="checkBox">橄榄球
<br>
<input type="checkBox">棒球
</div>
</div>
</body> </html>