                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /Tab選項卡切換效果

代碼運(yùn)行不出來，沒有效果，求大神幫助

<!doctype html>
<html>
<head>
??? <meta charset="UTF-8">
?? ?<title>Document</title>
?? ?<style type="text/css">
??? *{margin:0;
???? padding:0;
???? font-size:13px;
???? list-style:none;}

.menu{width:210px;
????? margin:50px auto;
????? border:1px solid #ccc;}

.menu p{height:25px;
??????? line-height:25px;
??????? font-weight:bold;
??????? background:#eee;
??????? border-bottom:1px solid #ccc;
??????? cursor:pointer;
??????? padding-left:5px;}

.menu div ul{display:none;}

.menu li{height:24px;
???????? line-height:24px;
???????? padding-left:5px;}
</style>
?? ?<script type="text/javascript">
?? ?window.onload=function(){
?? ??? ?
????? // 將所有點擊的標(biāo)題和要顯示隱藏的列表取出來
??? var ps=document.getElementById('menu').getElementsByTagName('p');
??? var uls=document.getElementById('menu').getElementsByTagName('ul');
??? if(ps.length!=uls.length)
??? return;
???? // 遍歷所有要點擊的標(biāo)題且給它們添加索引及綁定事件
??? for(var i=0;i<ps.length;i++){
??????? ps[i].id=i;
??????? ps[i].onclick=function(){
??????????? if(uls[i].style.display=='block')
??????????? {
?????????????? uls[i].style.display=='none'
?????????????? ?
??????????? }
???????? else
???????? {???? ?
?????????? uls[i].style.display='block';
???????? }
??? }
???? // 獲取點擊的標(biāo)題上的索引屬性，根據(jù)該索引找到對應(yīng)的列表

???? // 判斷該列表，如果是顯示的則將其隱藏，如果是隱藏的則將其顯示出來

?? ?}
?? ?</script>
</head>
<body>
?? ?<div class="menu" id="menu">
?? ??? ?<div>
?? ??? ??? ?<p>Web前端</p>
?? ??? ??? ?<ul style="display:none">
?? ??? ??? ??? ?<li>JavaScript</li>
?? ??? ??? ??? ?<li>DIV+CSS</li>
?? ??? ??? ??? ?<li>jQuery</li>
?? ??? ??? ?</ul>
?? ??? ?</div>
?? ??? ?<div>
?? ??? ??? ?<p>后臺腳本</p>
?? ??? ??? ?<ul style="display:block;">
?? ??? ??? ??? ?<li>PHP</li>
?? ??? ??? ??? ?<li>ASP.net</li>
?? ??? ??? ??? ?<li>JSP</li>
?? ??? ??? ?</ul>
?? ??? ?</div>
?? ??? ?<div>
?? ??? ??? ?<p>前端框架</p>
?? ??? ??? ?<ul>
?? ??? ??? ??? ?<li>Extjs</li>
?? ??? ??? ??? ?<li>Esspress</li>
?? ??? ??? ??? ?<li>YUI</li>
?? ??? ??? ?</ul>
?? ??? ?</div>
?? ?</div>
</body>
</html>