js---复选框（全选，不选，反选）demo1--
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js---复选框（全选，不选，反选）demo1--相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <span style="font-size: 24px;">javascript 案例 全选 不选 反选</span><br /> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>全选 不选 反选</title> </head> <script> window.onload=function (){ var oBtn1=document.getElementById("Btn1"); var oBtn2=document.getElementById("Btn2"); var oBtn3=document.getElementById("Btn3"); var oDiv=document.getElementById("Ben"); var oInp=oDiv.getElementsByTagName("input"); oBtn1.onclick=function(){ //全选 //oInp[0].checked=true; // checked ： 布尔值 false true; for(var i=0; i<oInp.length ; i++){ oInp[i].checked=true; } }; oBtn2.onclick=function(){ //不选 for(var i=0; i<oInp.length ; i++){ oInp[i].checked=false; } }; oBtn3.onclick=function(){ //反选 for(var i=0; i<oInp.length ; i++){ if(oInp[i].checked==true){ oInp[i].checked=false; } else{ oInp[i].checked=true; } } }; }; </script> <body> <input id="Btn1" type="button" value="全选" /><br /> <input id="Btn2" type="button" value="不选" /><br /> <input id="Btn3" type="button" value="反选" /><br /> <div id="Ben"> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <!--复选框 checked 选中--> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkbox" /><br /> </div> </body> </html>
以上是关于js---复选框（全选，不选，反选）demo1--的主要内容，如果未能解决你的问题，请参考以下文章