js没有效果，哪里错了？-慕课网

js没有效果，哪里错了？

来源：1-2 tab页面布局-标题布局

qq_小白_7

2015-09-21 11:32

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>hover()方法切换事件</title>
       
        <style>
            *{padding:0px;margin:0px;
               list-style:none;font-size:17px;}
               #wrap{width:300px;border:1px solid #eee;margin:0 auto;overflow:hidden}
               #header{height:35px;background:#eee}
               #wrap #header ul li{float:left;line-height:35px;height:35px;width:58px;text-align:center;list-style:none;border-left:1px solid #fff;
               border-right:1px solid #fff;}
               .aa{background:white;font-weight:bold;}
               
               #content p{line-height:40px;text-align:center;}
               .one{display:block;} 
               .two{display:none;} 
               
        </style>
     </head>
    <body>
    <div id="wrap">
        <div id="header">
            <ul>
                <li  class="aa">公告</li>
                <li  class="">公告</li>
                <li  class="">公告</li>
                <li  class="">公告</li>
                <li  class="">公告</li>
            </ul>
        </div>
        <div id="content">
            <p class="one">
                1法的功能是当鼠,
                方法的功能是当鼠,
                方法的功能是当鼠,
                方法的功能是当鼠.
            </p>
            <p class="two">
                2法的功能是当鼠,
                方法的功能是当鼠,
                方法的功能是当鼠,
                方法的功能是当鼠.
            </p>
            <p class="two">
               3法的功能是当鼠
                方法的功能是当鼠
                方法的功能是当鼠
                方法的功能是当鼠
            </p>
            <p class="two" >
               4法的功能是当鼠
               方法的功能是当鼠
                方法的功能是当鼠
                方法的功能是当鼠
            </p>
            <p class="two">
               方法的功能是当鼠
               方法的功能是当鼠
                方法的功能是当鼠
                方法的功能是当鼠
            </p>
        </div> 
    </div>
         
        <script>
       window.onload=function(){ 
       var l=document.getElementsByTagName("li")
       var u=document.getElementsByTagName("p")
      for(i=0;i<l.length;i++){
          l[i].index=i;
        l[i].onclick=function(){
            for(j=0;j<l.length;j++){
                l[j].className="";
                u[j].className="two";
         }
          this.className="aa";
          u[this.index].className="one"
           }
    }
         }
        </script>
    </body>
</html>

点击后内容没有变化，不知道哪里错了

写回答关注