                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /JavaScript
                        
                        /JavaScript進(jìn)階篇

為什么不能實(shí)現(xiàn)切換的效果

<!DOCTYPE?html>
<html>
<head?lang="en">
????<meta?charset="UTF-8">
????<title>實(shí)踐題?-?選項(xiàng)卡</title>
????<style?type="text/css">
?/*?CSS樣式制作?*/
?#tabs{height:?150px;width:?300px;padding:?5px;margin:?20px}
????????body,ul,li,div{margin:?0px;padding:?0px}
????????#tabs?ul{list-style:none;display:?block;border-bottom:?2px?solid?saddlebrown;height:30px;line-height:30px;}
????????#tabs?ul?li{float:left;cursor:?pointer;?list-style:none;height:28px;line-height:28px;margin:0px?6px;border:1px?solid?;display:inline-block;width:?60px;text-align:?center;border-bottom:?none}
????????#tabs?ul?li.show{border-bottom:?2px?solid?#FFFFFF;border-top:?solid?2px?saddlebrown}
????????#tabs?div{height:?120px;?border:?solid?1px;border-top:?none;padding:?5px;line-height:?30px;}
????????.hide{display:?none}

????</style>
????<script?type="text/javascript">

?//?JS實(shí)現(xiàn)選項(xiàng)卡切換
?window.onload=function?()?{
????????????var?getTabs?=?document.getElementById("tabs");
?var?getUl?=?getTabs.document.getElementsByTagName("ul")[0];
?var?getLis?=?getUl.document.getElementsByTagName("li");
?var?getDivs?=?getTabs.document.getElementsByTagName("div");

?for(var?i?=?0;i<getLis.length;i++)
????????????{
????????????????getLis[i].index?=?i;
?getLis[i].onmouseover=function?(?)?{
????????????????????for(var?n=?0;n<getLis.length;n++){
????????????????????????getLis[n].className?=?"";
?getDivs[n].className?=?"hide";
?}
????????????????????this.className="show";
?getDivs[this.index].className="?";
?}
????????????}
????????}
????</script>

</head>
<body>
<!--?HTML頁(yè)面布局?-->
<div?id="tabs">
????<ul?>
????????<li?class="show">房產(chǎn)</li>
????????<li>家居</li>
????????<li>二手房</li>
????</ul>
????<div>
?275萬(wàn)購(gòu)昌平鄰鐵三居?總價(jià)20萬(wàn)買(mǎi)一居<br>
?200萬(wàn)內(nèi)購(gòu)五環(huán)三居?140萬(wàn)安家東三環(huán)<br>
?北京首現(xiàn)零首付樓盤(pán)?53萬(wàn)購(gòu)東5環(huán)50平<br>
?京樓盤(pán)直降5000?中信府?公園樓王現(xiàn)房<br>
????</div>
????<div?class="hide">
?40平出租屋大改造?美少女的混搭小窩<br>
?經(jīng)典清新簡(jiǎn)歐愛(ài)家?90平老房煥發(fā)新生<br>
?新中式的酷色溫情?66平撞色活潑家居<br>
?瓷磚就像選好老婆?衛(wèi)生間煙道的設(shè)計(jì)<br>
????</div>
????<div?class="hide">
?通州豪華3居260萬(wàn)?二環(huán)稀缺2居250w甩<br>
?西3環(huán)通透2居290萬(wàn)?130萬(wàn)2居限量搶購(gòu)<br>
?黃城根小學(xué)學(xué)區(qū)僅260萬(wàn)?121平70萬(wàn)拋!<br>
?獨(dú)家別墅280萬(wàn)?蘇州橋2居優(yōu)惠價(jià)248萬(wàn)<br>
????</div>
</div>
</body>
</html>