函數(shù)里的this為什么不能用li[i]呢?
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>實(shí)踐題 - 選項(xiàng)卡</title>
? ? <style type="text/css">
*{
margin:0;
padding:0;
}
ul{
list-style:none;
text-align:center;
line-height:20px;
width:350px;
height:20px;
border-bottom:2px solid saddlebrown;
}
ul li {
float:left;
width:50px;
height:20px;
margin-right:5px;
border:solid 1px #aaa;
border-bottom:none;
}
.hide{
display:none;
}
.on {
height:17px;
border-top:2px solid saddlebrown;
border-bottom:3px #fff solid;
}
#tabs {
width:350px;
margin:0 auto;
}
#tabs div{
width:348px;
height:88px;
border:1px solid #369;
border-top:none;
}
? ? </style>
? ? <script type="text/javascript"> ? ? ? ?
? ? // JS實(shí)現(xiàn)選項(xiàng)卡切換
window.onload=function (){
var tabs=document.getElementById("tabs");
var ul=tabs.getElementsByTagName("ul")[0];
var li=ul.getElementsByTagName('li');
var div=tabs.getElementsByTagName("div");
for(i=0;i<li.length;i++){
li[i].aaa=i;
li[i].onclick=function (){
for(z=0;z<li.length;z++){
li[z].className='';
div[z].className='hide';
}
//document.write(i);
this.className='on';
div[this.aaa].className='';
}
}
}
? ? </script>
</head>
<body>
<!-- HTML頁面布局 -->
<div id="tabs">
? ? <ul>
? ? ? ?<li>房產(chǎn)</li>?
? ? ? ?<li>家居</li>?
? ? ? ?<li>二手房</li>?
? ? </ul>
? ? <div>
? ? ? ? 275萬購昌平鄰鐵三居 總價(jià)20萬買一居<br>
? ? ? ? 200萬內(nèi)購五環(huán)三居 140萬安家東三環(huán)<br>
? ? ? ? 北京首現(xiàn)零首付樓盤 53萬購東5環(huán)50平<br>
? ? ? ? 京樓盤直降5000 中信府 公園樓王現(xiàn)房<br>
? ? </div>
? ? <div>
? ? ? ? 40平出租屋大改造 美少女的混搭小窩<br>
? ? ? ? 經(jīng)典清新簡歐愛家 90平老房煥發(fā)新生<br>
? ? ? ? 新中式的酷色溫情 66平撞色活潑家居<br>
? ? ? ? 瓷磚就像選好老婆 衛(wèi)生間煙道的設(shè)計(jì)<br>
? ? </div>
? ? <div>
? ? ? ? 通州豪華3居260萬 二環(huán)稀缺2居250w甩<br>
? ? ? ? 西3環(huán)通透2居290萬 130萬2居限量搶購<br>
? ? ? ? 黃城根小學(xué)學(xué)區(qū)僅260萬 121平70萬拋!<br>
? ? ? ? 獨(dú)家別墅280萬 蘇州橋2居優(yōu)惠價(jià)248萬<br>
? ? </div>
</div>
?
</body>
</html>
2016-12-30
你可以試著把i和z聲明為let類型的變量,看看問題還存不存在了。
2016-12-28
這是因?yàn)槭侨肿饔糜蜃兞?,for循環(huán)結(jié)束后i的值已經(jīng)變?yōu)榱?,onclick引用的是變換之后的值了,這是典型的閉包問題。
2016-12-27