问答详情
源自：-

第十章编程练习问题

window.onload = function(){
             var oTab = document.getElementById("tabs");
             var oUl = oTab.getElementsByTagName("ul")[0];
             var oLis = oUl.getElementsByTagName("li");
             var oDivs= oTab.getElementsByTagName("div");

             for(var i= 0,len = oLis.length;i<len;i++){
                 oLis[i].index = i;
                 oLis[i].onclick = function() {
                     for(var n= 0;n<len;n++){
                         oLis[n].className = "";
                         oDivs[n].className = "hide";
                     }
                     this.className = "on";
                     oDivs[this.index].className = "";
                 }
             };
         }

这个里面的.index是什么含义?

提问者：陈水 2015-10-30 12:50

个回答

  • 逆光之羽
    2015-10-30 14:04:13
    已采纳

    .index是自定义的属性,li标签本身是没有index属性的;

    楼主的代码里 oLis[i].index = i;这句里用index存放了i值；

    所以后面 oDivs[this.index].className = "";这里this.index才能拿到值;

    你看下我写的测试代码

    开始的时候index本来是未定义的

    赋值之后才有了值;

    <html>
<head>
    <script type="text/javascript">
        function test(){
            var oUl = document.getElementsByTagName("ul")[0];
            var oLis = oUl.getElementsByTagName("li");
            alert(oLis[1].index);        //这里出来的是undefined
            oLis[1].index = 1;
            alert(oLis[1].index);        //这里出来的是赋予的值
        }
    </script>
</head>
<body>
    <input type="button" onclick="test()" value="test">
    <ul>
        <li>li1</li>
        <li>li2</li>
        <li>li3</li>
    </ul>
</body>
</html>



    0