JavaScript学习记录总结（八）—

JavaScript学习记录总结（八）——全选、反选

<!DOCTYPE html>
<html>
<head>
<title>checkboxs.html</title>

<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">



<script type="text/javascript">
   //select 不行

   function selects(value) {
       //获取所有的 name=fav的<input type="checkbox" name="fav" value="打架1"/>对象的集合
       var favsDom = document.getElementsByName("fav");
       if (value == 0) {
           for (var i = 0; i < favsDom.length; i++) {
               var favDom = favsDom[i];//获取具体的对象
               if (favDom.checked) {
                   favDom.checked = false;
               }
           }
       } else if (value == 1) {
           for (var i = 0; i < favsDom.length; i++) {
               var favDom = favsDom[i];//获取具体的对象
               if (!favDom.checked) {
                   favDom.checked = true;
               }
           }
       } else if (value == -1) {
           for (var i = 0; i < favsDom.length; i++) {
               var favDom = favsDom[i];//获取具体的对象
                favDom.checked = !favDom.checked;

           }
       }

   }
</script>
</head>

<body>
   <div>
       <input type="checkbox" name="fav" value="打架1" />打架1<br /> <input
           type="checkbox" name="fav" value="打架2" />打架2<br /> <input
           type="checkbox" name="fav" value="打架3" />打架3<br /> <input
           type="checkbox" name="fav" value="打架4" />打架4<br /> <input
           type="checkbox" name="fav" value="打架5" />打架5<br /> <input
           type="checkbox" name="fav" value="打架6" />打架6<br />
   </div>

   <div>
       <input type="button" id="qx" value="全选" onclick="selects(1)" /> <input
           type="button" id="fx" value="反选" onclick="selects(-1)" /> <input
           type="button" id="qbx" value="全不选" onclick="selects(0)" />
   </div>

</body>
</html>