初学js者必看的，用js做全选，不选，反选的选项卡（基础的）

来源：互联网发布：军爷脸型数据编辑：程序博客网时间：2024/06/18 03:56

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
   <title>全选，不选，反选</title>
   <style type="text/css">
   </style>
</head>
<body>
<input id="btn1" type="button" value="全选">
<input id="btn2" type="button" value="不选">
<input id="btn3" type="button" value="反选">
<div id="div1">
   <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>
<script type="text/javascript">
   var oBtn1=document.getElementById('btn1');
   var oBtn2=document.getElementById('btn2');
   var oBtn3=document.getElementById('btn3');
   var oDiv=document.getElementById('div1');
   var oCh=oDiv.getElementsByTagName('input');
   oBtn1.onclick=function()
   {
       for(var i=0;i<oCh.length;i++)
       {
           oCh[i].checked=true;
       }
   }
   oBtn2.onclick=function()
   {
       for(var i=0;i<oCh.length;i++)
       {
           oCh[i].checked=false;
       }
   }
   oBtn3.onclick=function()
   {
       for(var i=0;i<oCh.length;i++)
       {
           if(oCh[i].checked=true)
           {
               oCh[i].checked=false;
           }
           else
           {
               oCh[i].checked=true;
           }
       }
   }
</script>

</html>

附：这是一个用js做的全选，反选，不选的选项卡

ture，false是布尔值，ture代表真，false代表假

checked表示的是预定选中的单选框或复选框

checked=ture表示预定是选中的

checked=false表示预定是没有选中的

0 0