const checkBoxs = ["篮球","足球","羽毛球","乒乓球"];
const creactCheckBox = text => {
let checkBox = document.createElement("input");
checkBox.setAttribute("type","checkBox");
document.body.insertAdjacentElement("beforeend", checkBox);
document.body.insertAdjacentText("beforeend", text);
};
checkBoxs.forEach((item,index) => creactCheckBox(item));
const selector = dom => document.querySelectorAll(dom);
const [checkAllBtn,checkNotBtn,checkRevBtn] = [selector("#checkAllBtn")[0],selector("#checkNotBtn")[0],selector("#checkRevBtn")[0]];
const actions = {
checkAll(){
selector("input[type='checkBox']").forEach(function (option,index) {
option.checked = true
})
},
checkNot(){
selector("input[type='checkBox']").forEach(function (option,index) {
option.checked = false
})
},
checkRev(){
selector("input[type='checkBox']").forEach(function (option,index) {
option.checked ? option.checked = false : option.checked = true
})
}
};
checkAllBtn.addEventListener("click",function(){actions.checkAll()});
checkNotBtn.addEventListener("click",function(){actions.checkNot()});
checkRevBtn.addEventListener("click",function(){actions.checkRev()})
花了三分钟帮你写,包含ES6箭头函数
const
forEach
解构赋值
querySelectorAll
