在邮箱中常见的,反选,全选,不选。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script>
            window.onload=function(){
                var oBtn1=document.getElementById('btn1');
                var oBtn2=document.getElementById('btn2');
                var oBtn3=document.getElementById('btn3');
                var oDiv=document.getElementById('div1');
                var aCh=oDiv.getElementsByTagName('input');
                oBtn1.onclick=function(){
                    for(var i=0;i<aCh.length;i++)
                    {
                        aCh[i].checked=true;
                    }
                };
                oBtn2.onclick=function(){
                    for(var i=0;i<aCh.length;i++)
                    {
                        aCh[i].checked=false;
                    }
                };
                oBtn3.onclick=function(){
                    for(var i=0;i<aCh.length;i++)
                    {
                        if (aCh[i].checked==true) {
                            aCh[i].checked=false;
                        } else{
                            aCh[i].checked=true;
                        }
                    }
                };

            }
        </script>
    </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 />
            <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>

这个作业不是很难,但是找小细节的问题费了很多事情,第一个是修改了命名,导致命名不统一,效果出不来。第二,getElementsByTabName这个单词写错,当中有个S忘记了。第三,在for循环中后面紧跟的条件有顺序要求分别是初始化,条件,自增或者自减。

漫漫修仙路,悠悠努力时。

posted @ 2015-10-15 10:41  路途遥远勿忘初心  阅读(293)  评论(0编辑  收藏  举报