代码示例:
<body>
<input type="button" id="checkBtn" value="全选"/>
<input type="button" id="cancelBtn" value='全不选' />
<input type="button" id='inverseBtn' value="反选">
<br />
<br />
<input type="checkbox" name="hobbies" />踢足球
<input type="checkbox" name="hobbies" />打篮球
<input type="checkbox" name="hobbies" />羽毛球
<br />
<input type="checkbox" name="hobbies" />曲棍球
<input type="checkbox" name="hobbies" />撑杆跳
<input type="checkbox" name="hobbies" />橄榄球
<br />
<input type="checkbox" name="hobbies" />棒球
<input type="checkbox" name="hobbies" />滑雪
<input type="checkbox" name="hobbies" />跳高
<br />
<input type="checkbox" name="hobbies" />跑步
<input type="checkbox" name="hobbies" />跳远
<input type="checkbox" name="hobbies" />飞盘
<br />
<input type="checkbox" name="hobbies" />滑冰
<input type="checkbox" name="hobbies" />排球
<input type="checkbox" name="hobbies" />摆烂
</body>
<script>
var rBtn = document.getElementById('rBtn');
var cBtn = document.getElementById('checkBtn');
var hobbyObj = document.getElementsByName('hobbies');
var cancelBtn = document.getElementById('cancelBtn');
var inverseBtn = document.getElementById('inverseBtn');
// 全选
cBtn.onclick = function(){
for(var i = 0 ; i < hobbyObj.length ;i++ ){
hobbyObj[i].checked = true;
}
}
// 全不选
cancelBtn.onclick = function() {
for(var i = 0 ; i < hobbyObj.length ;i++ ){
hobbyObj[i].checked = false;
}
}
// 反选
inverseBtn.onclick = function(){
for(var i = 0 ; i < hobbyObj.length;i++){
if(hobbyObj[i].checked == true){
hobbyObj[i].checked = false;
}else {
hobbyObj[i].checked = true;
}
}
}
var a;
console.log(undefined + 10);
</script>