aLi[i].index = i; 为什么这样写? 以及下面代码??为什么这样写

来源:10-1 编程挑战

listenlo

2016-05-04 11:10

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>实践题 - 选项卡</title>

    <style type="text/css">

        /* CSS样式制作 */

        * {

            margin: 0;

            padding: 0;

            font: normal 12px "微软雅黑";

            color: #000000;

        }


        ul {

            list-style-type: none;

        }


        a {

            text-decoration: none;

        }


        #tab-list {

            width: 275px;

            height: 190px;

            margin: 20px auto;

        }


        #ul1 {

            border-bottom: 2px solid #8B4513;

            height: 32px;

        }


            #ul1 li {

                display: inline-block;

                width: 60px;

                line-height: 30px;

                text-align: center;

                border: 1px solid #999;

                border-bottom: none;

                margin-left: 5px;

            }


                #ul1 li:hover {

                    cursor: pointer;

                }


                #ul1 li.active {

                    border-top: 2px solid #8B4513;

                    border-bottom: 2px solid #FFFFFF;

                }


        #tab-list div {

            border: 1px solid #7396B8;

            border-top: none;

        }


            #tab-list div li {

                height: 30px;

                line-height: 30px;

                text-indent: 8px;

            }


        .show {

            display: block;

        }


        .hide {

            display: none;

        }

    </style>

    <script type="text/javascript">


        window.onload = function () {

            var oUl1 = document.getElementById("ul1");//获取ul;

            var aLi = oUl1.getElementsByTagName("li");  //获取li;

            var oDiv = document.getElementById("tab-list");  //获取父元素div;

            var aDiv = oDiv.getElementsByTagName("div");    //获取子元素div

            for (var i = 0; i < aLi.length; i++) {   //遍历li的个数

                aLi[i].index = i;    ???????????

                aLi[i].onmousedown = function () {  //鼠标点击经过时

                    for (var i = 0; i < aLi.length; i++) {   //遍历li的个数

                        aLi[i].className = ""; //??????????

                    }

                    this.className = "active";   ???????、

                    for (var j = 0; j < aDiv.length; j++) {   //????????、

                        aDiv[j].className = "hide";           //?????

                    }

                    aDiv[this.index].className = "show";   //???????、、

                }

            }

        }



    </script>


</head>

<body>

    <!-- HTML页面布局 -->

    <div id="tab-list">

        <ul id="ul1">

            <li>房产</li>

            <li>家居</li>

            <li>二手房</li>

        </ul>

        <div>

            <ul>

                <li><a href="javascript:;">275万购昌平邻铁三居 总价20万买一居</a></li>

                <li><a href="javascript:;">200万内购五环三居 140万安家东三环</a></li>

                <li><a href="javascript:;">北京首现零首付楼盘 53万购东5环50平</a></li>

                <li><a href="javascript:;">京楼盘直降5000 中信府 公园楼王现房</a></li>

            </ul>

        </div>

        <div>

            <ul>

                <li><a href="javascript:;">40平出租屋大改造 美少女的混搭小窝</a></li>

                <li><a href="javascript:;">经典清新简欧爱家 90平老房焕发新生</a></li>

                <li><a href="javascript:;">新中式的酷色温情 66平撞色活泼家居</a></li>

                <li><a href="javascript:;">瓷砖就像选好老婆 卫生间烟道的设计</a></li>

            </ul>

        </div>

        <div>

            <ul>

                <li><a href="javascript:;">通州豪华3居260万 二环稀缺2居250w甩</a></li>

                <li><a href="javascript:;">西3环通透2居290万 130万2居限量抢购</a></li>

                <li><a href="javascript:;">黄城根小学学区仅260万 121平70万抛!</a></li>

                <li><a href="javascript:;">独家别墅280万 苏州桥2居优惠价248万</a></li>

            </ul>

        </div>

    </div>

</body>

</html>


写回答 关注

2回答

  • qq_墨分天下_0
    2016-05-04 15:20:53
    已采纳

    获取当前位置 在数组中的

    listen...

    非常感谢!

    2016-05-04 15:31:03

    共 1 条回复 >

  • 荔枝大大
    2018-12-19 15:36:19

    为啥要获取父元素div啊

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468784 学习 · 22562 问题

查看课程

相似问题