為什么big_ka[i].className+=" active";實(shí)現(xiàn)不了,幫我看看,邏輯哪里不對(duì),急急急
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>實(shí)踐題 - 選項(xiàng)卡</title>
? ? <style type="text/css">
? ? ?/* CSS樣式制作 */ ?
? ? ?.big{
? ? ? ? ?position:relative;
? ? ? ? ?width:300px;
? ? ? ? ?height:300px;
? ? ?}
? ? ?.main li{
? ? ? ? ?list-style:none;
? ? ? ? ?display:inline-block;
? ? ? ? border-style:solid;
? ? ? ? border-bottom-color:#FFF;
? ? ? ? width:50px;
? ? ? ? line-height:30px;
? ? ?}
? ? ?.down{
? ? ? ? ?position:absolute;
? ? ? ? ?top:32px;
? ? ? ? ?left:0;
? ? ? ? ?width:300px;
? ? ? ? ?height:200px;
? ? ? ? ?overflow:hidden;
? ? ? ? ?border-style:solid;
? ? ? ? ?display:none;
? ? ?}
.main:hover li{
cursor:pointer;
}
? ? ?.active{
? ? ? ? ?display:block;
? ? ?}
? ? </style>
?
</head>
<body>
<!-- HTML頁(yè)面布局 -->
<div id="big1">
? ? <div id="main1">
? ? <ul>
? ? ? ? <li><a href="javascript:switch1" id="fangchan">房產(chǎn)</a></li>
? ? ? ? <li><a href="javascript:switch1" id="jiaju">家居</a></li>
? ? ? ? <li><a href="javascript:switch1" id="ershoufang">二手房</a></li>
? ? </ul>
? ? </div>
? ? <div class="down ?active ">
? ? 275萬購(gòu)昌平鄰鐵三居 總價(jià)20萬買一居
? ? 200萬內(nèi)購(gòu)五環(huán)三居 140萬安家東三環(huán)
? ? 北京首現(xiàn)零首付樓盤 53萬購(gòu)東5環(huán)50平
? ? 京樓盤直降5000 中信府 公園樓王現(xiàn)房?
?
? ? </div>
? ? <div>
? ? ?40平出租屋大改造 美少女的混搭小窩
? ? ?經(jīng)典清新簡(jiǎn)歐愛家 90平老房煥發(fā)新生
? ? ?新中式的酷色溫情 66平撞色活潑家居
? ? ?瓷磚就像選好老婆 衛(wèi)生間煙道的設(shè)計(jì)
??
? ? </div>
? ? <div>
??
? ? ?通州豪華3居260萬 二環(huán)稀缺2居250w甩
? ? ?西3環(huán)通透2居290萬 130萬2居限量搶購(gòu)
? ? ?黃城根小學(xué)學(xué)區(qū)僅260萬 121平70萬拋!
? ? ?獨(dú)家別墅280萬 蘇州橋2居優(yōu)惠價(jià)248萬 ?
??
? ? </div>
? ??
? ??
</div>
?
</body>
? ? <script type="text/javascript">
? ? ? function switch1(){
? var main_i = document.getElementById("main1");
var main_s = document.getElementsByTagName("li");
var big_ka = document.getElementsByClassName("down");
for(var i=0;i<=main_s.length;i++){
main_s[i].onmouseover=function(){
for(var k=0;k<=big_ka.length;k++){
big_ka[k].className=big_ka[k].className.replace("active","");
}
big_ka[i].className+=" active";
}
}
?} ??
? ? // JS實(shí)現(xiàn)選項(xiàng)卡切換
? ? window.onload=function(){
? ? ? ?switch1();
}
? ??
? ? </script>
</html>
2017-08-09
循環(huán)時(shí)超過索引了, ?一共三個(gè)元素,索引為 ?0 ,1 ,2
i<=main_s.length ? =》 ? ??i<main_s.length
k<=big_ka.length ? = 》 ??k<big_ka.length