复选框实现全选、全不选、被选；
html代码
<input type="checkbox" id="checksboxs">全选<input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1"><input type="checkbox" class="checks1">
js代码
<script type="text/javascript">var checksboxs = document.getElementById('checksboxs');var checks1 = document.getElementsByClassName('checks1');// 全选checksboxs.onchange = function(){for(var i = 0;i<checks1.length;i++){checks1[i].checked = this.checked;}}var index = 0;// 用来计数for(let i = 0;i<checks1.length;i++){每次点击循环一遍所有的元素，存在值为 false（没选中的复选框）就给 checksboxs 赋值falsevar flag = true;for(let j = 0;j<checks1.length;j++){if(!checks1[j].checked){flag = false;break;}}checksboxs.checked = flag;}}</script>
按钮实现全选、全不选、多选；
html代码
<input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><input type="checkbox" class="checks"><button id="allCheck">全选</button><button id="notCheck">全不选</button><button id="reveCheck">反选</button>
js代码
<script type="text/javascript">var allCheck = document.getElementById('allCheck');var notCheck = document.getElementById('notCheck');var reveCheck = document.getElementById('reveCheck');var checks = document.getElementsByClassName('checks');// 全选allCheck.onclick = function(){for(var i = 0;i<checks.length;i++){checks[i].checked = true;}}//全不选notCheck.onclick = function(){for(var i = 0;i<checks.length;i++){checks[i].checked = false;}}//反选reveCheck.onclick = function(){for(var i = 0;i<checks.length;i++){checks[i].checked = !(checks[i].checked)}}</script>
