哪位大神帮看看,哪里出错了,运行不了?

来源:10-1 编程挑战

夜阑卧听风吹雨y

2018-06-20 19:20

<style type="text/css">        

     *{

    margin:0px; padding:0px; font:12px normal; font-family:微软雅黑;

    }       

 #tabs{

     width:290px; height:150px; padding:5px; margin:20px;

 }

 #tabs ul{

     list-style:none; display:block; height:30px; line-height:30px;

 }

 #tabs ul li{

     float:left; width:60px; height:28px; line-height:28px; text-align:center;

     display:inline-block;margin:0px 3px; border:1px solid #aaa;border-bottom:none;

     cursor:pointer; background:#fff; list-style:none;

 }

 #tabs ul li.on{

     border-top:2px solid saddlebrown; border-bottom:2px solid #fff;

 }

 #tabs div{

     height:120px; line-height:25px; border:1px solid #336699;border-top:2px saddlebrown solid;padding:5px;

 }

 .hide{display:none;}

</style>

    <script type="text/javascript">

       window.onload = function(){

           var oTab = document.getElementsByTagName('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="";

                } } }

    </script>

</head>

<body>

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

  <div id="tabs">

  <ul>

         <li class="on">房产</li>

         <li>家居</li>

         <li>二手房</li>

       </Ul>

       <div>

         275万购昌平邻铁三居 总价20万买一居<br>

         200万内购五环三居 140万安家东三环<br>

         北京首现零首付楼盘 53万购东5环50平<br>

        京楼盘直降5000 中信府 公园楼王现房<br>

       </div>

       <div class="hide">

          40平出租屋大改造 美少女的混搭小窝<br>

         经典清新简欧爱家 90平老房焕发新生<br>

         新中式的酷色温情 66平撞色活泼家居<br>

         瓷砖就像选好老婆 卫生间烟道的设计<br>

       </div>

       <div class="hide">

         通州豪华3居260万 二环稀缺2居250w甩<br>

         西3环通透2居290万 130万2居限量抢购<br>

         黄城根小学学区仅260万 121平70万抛!<br>

        独家别墅280万 苏州桥2居优惠价248万<br>

       </div>

   </div>

哪位大神帮看看,哪里出错了,运行不了?

写回答 关注

5回答

  • 码美
    2018-07-05 17:47:38

    var oTab = document.getElementsByTagName('tabs');改成

    var oTab = document.getElementsById('tabs');

    码美

    改成这个,不好意思,上面那个写错了,id是唯一的,不是复数,所以是element不是elements var oTab = document.getElementById('tabs');

    2018-07-05 17:49:26

    共 1 条回复 >

  • 慕瓜8946466
    2018-06-26 17:07:44

     for(var i = 0;len=oLis.length;i<len; i++)

    var i = 0;后面的;换成,

    夜阑卧听风吹...

    呵呵,这个你确定?再看看格式吧

    2018-07-04 12:56:59

    共 1 条回复 >

  • 夜阑卧听风吹雨y
    2018-06-24 13:16:31

    按照两位大神的改了,还是不行

  • 阳火锅
    2018-06-21 15:21:17

    老夫纵横代码界多年,无意间发现你3处小错误:

    1.注意html里面的<ul></UL>标签,你把大写部分改过来..

    2.var oTab = document.getElementsByTagName('tabs');这句代码里面的tabs明明是id为什么你要用document.getElementsByTagName?  应该用document.getElementById..

    3.把len=oLis.length去掉。。直接i<oLis.length; 下面也是一样 n<len 改成 n<oLis.length

  • 八尺一寻
    2018-06-21 14:39:06

    for 循环的括号里是两个分号(初始化;条件;自增);html代码那边 ul 都是小写会比较好

JavaScript进阶篇

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

467373 学习 · 21877 问题

查看课程

相似问题