需求： 切換選中
1.1 點擊全選按鈕 將每一個復選框的狀態都變成選中
1.2 點擊不選按鈕 將每一個復選框的狀態都變成不選中
1.3 點擊反選按鈕 將選中的復選框變成不選中 將不選中的變成選中
代碼實作：
// 1、獲取元素
var btns = document.getElementsByTagName('button');
var inps = document.getElementsByTagName('input');
console.log(btns, inps);
// 2、點擊事件 點擊全選按鈕
btns[0].onclick = function () {
// 3、每一個復選框
for (var i = 0; i < inps.length; i++) {
console.log(inps[i]);
// 4、復選框的狀態都變成選中
inps[i].checked = true;
}
}
// 2、點擊事件 點擊反選按鈕
btns[1].onclick = function () {
// 3、每一個復選框
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 = !inps[i].checked;
}
}
// 2、點擊事件 點擊不選按鈕
btns[2].onclick = function () {
// 3、每一個復選框
for (var i = 0; i < inps.length; i++) {
// 4、復選框的狀態都變成不選中
inps[i].checked = false;
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/297596.html
標籤：其他
上一篇：前端基礎必知必會