<div id="select">
<input type="checkbox" name="love" id="1">琴
<input type="checkbox" name="love" id="2">棋
<input type="checkbox" name="love" id="3">書
<input type="checkbox" name="love" id="4">畫
</div>
<button id="all">全選</button>
<button id="selected">反選</button>
<button id="allNull">全不選</button>
===============================================
// js代碼
window.onload = function() {
var select = document.getElementById('select');
select = select.children;
//綁定點擊事件
var all = document.getElementById('all');
all.onclick = function() {
for (var i = 0; i < select.length; i++) {
select[i].checked = true;
}
}
var selected = document.getElementById('selected');
selected.onclick = function() {
for (var i = 0; i < select.length; i++) {
select[i].checked ? select[i].checked = false : select[i].checked = true;
/*if (select[i].checked) {
select[i].checked = false;
} else {
select[i].checked = true;
}*/
}
}
var allNull = document.getElementById('allNull');
allNull.onclick = function() {
for (var i = 0; i < select.length; i++) {
select[i].checked = false;
}
}
}