js实现全选和反选

现在有一个全选按钮

然后每一列的是循环出来的

 

 先获取到全选框和循环出来的框

let radius = document.getElementById('radio')
let cks = document.querySelectorAll("#j input");

然后给全选框绑定一个事件

//当点击全选框的时候让所有循环出来的复选框的checked变为true
redius.onclick = function() {
		for (let i = 0; i < cks.length; i++) {
//已知cks是循环出来的所有复选框
			cks[i].checked = true;
				if(redius.checked == false){
					cks[i].checked = false;
					}
				}
			}
//这个判断代表的是如果全选框的checked为false也就是未选中的情况下这些循环出来的复选框复制为未被选中

下一步给循环出来的复选框每一个都绑定一个事件

for (var i = 0; i < cks.length; i++) {
				cks[i].onclick = fn;
			}

最后一步

function fn() {
				var flag = true; //默认都被选中了
				//判断是否所有的复选框都选中
				for (var j = 0; j < cks.length; j++) {
					if (!cks[j].checked) {
						flag = false;
						break;
					}
				}
				redius.checked = flag;
			}