javascript实现简单的全选和反选功能

本文实例讲解了爪哇岛描述语言实现简单的全选和反选功能的详细代码，分享给大家供大家参考，具体内容如下

效果图：

具体代码：

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 '标题全选反选/标题/床头柜输入类型='按钮'值='全选id='all '输入类型='按钮'值='反选id=' reverse '输入类型=' checkbox ' id=' flag check ' ul id=' checkbox list ' Li输入类型=' checkbox '/Li Li输入类型=' checkbox '/Li Li输入类型=' checkbox '/Li Li输入类型=' checkbox '/Li Li输入类型=' checkbox '/李丽丽输入type=' checkbox '/李丽丽Li输入类型=' checkbox '/Li Li输入类型=' checkbox '/李丽丽输入类型=' checkbox '/Li输入类型=' checkbox '/Li/ul布尔属性，只要名字即可，值可为空选中、选中、只读、禁用./p脚本类型=' text/JavaScript '/1 .找节点var all BTN=文档。query selectorall(' all ')[0]；var反向BTN=文档。query selector(' # reverse ')；var FlagCheck=文档。GetElementByID(' FlagCheck ')；定义变量核对表=文档。queryselectorall(#复选框列表输入')；函数CheckAll(){ for(var j=0；j核对表。长度；j ) { if(！清单[j].选中){ break} } if(j==核对表。长度){ //alert('全部为真)FlagCheck . checked=true } else {//alert('至少一个不为真');flagCheck.checked=false} } //2。加事件//全选所有Btn。onclick=function(){ if(FlagCheck。选中){ FlagCheck。选中=假；for(var I=0；我核对表。长度；I){ 0核对表[i].选中=假；} } else { FlagCheck . checked=true for(var I=0；我核对表。长度；I){ 0核对表[i].选中=真；} } } //反选反转。onclick=function(){ for(var I=0；我核对表。长度；i ) {如果(核对表[i]).选中){核对表[i].选中=假；}else {核对表[i].选中=真；} } //执行检查所有清单是否被选上了checkAll()；} for(var I=0；我核对表。长度；I){ 0核对表[i].onclick=checkAll}/脚本/正文/html希望本文所述对大家学习爪哇岛描述语言程序设计有所帮助。