<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>實踐題?-?選項卡</title>
????<style?type="text/css">
????????*{padding:0px;margin:?0px;font:12px?normal?"microsoft?yahei";}
????????#tabs?{width:290px;padding:5px;height:150px;margin:20px;}
????????#tabs?ul{list-style:none;display:?block;height:30px;line-height:30px;border-bottom:2px?saddlebrown?solid;}
????????#tabs?ul?li{background:#fff;
????????????cursor:pointer;
????????????float:left;
????????????list-style:none;?
????????????height:28px;
????????????line-height:28px;
????????????margin:0px?3px;
????????????border:1px?solid?#aaaaaa;
????????????border-bottom:none;
????????????display:inline-block;
????????????width:60px;
????????????text-align:?center;}
????????#tabs?ul?li.on{border-top:2px?solid?saddlebrown;border-bottom:?2px?solid?#fff;}
????????#tabs?div{height:120px;line-height:?25px;border:1px?solid?#336699;border-top:none;padding:5px;}
????????.hide{display:?none;}
????</style>
????<script?type="text/javascript">
?????????window.onload?=?function(){
?????????????var?oTab?=?document.getElementById("tabs");
?????????????var?oUl?=?oTab.getElementsByTagName("ul")[0];
?????????????var?oLis?=?oUl.getElementsByTagName("li");
?????????????var?oDivs=?oTab.getElementsByTagName("div");
?????????????for(var?i=?0,len?=?oLis.length;i<len;i++){
?????????????????oLis[i].index?=?i;
?????????????????oLis[i].onclick?=?function()?{
?????????????????????for(var?n=?0;n<len;n++){
?????????????????????????oLis[n].className?=?"";
?????????????????????????oDivs[n].className?=?"hide";
?????????????????????}
?????????????????????this.className?=?"on";
?????????????????????oDivs[this.index].className?=?"";
?????????????????}
?????????????};
?????????}
????</script>
</head>
<body>
<div?id="tabs">
????<ul>
????????<li>房產</li>
????????<li>家居</li>
????????<li>二手房</li>
????</ul>
????<div>
????????275萬購昌平鄰鐵三居?總價20萬買一居<br>
????????200萬內購五環三居?140萬安家東三環<br>
????????北京首現零首付樓盤?53萬購東5環50平<br>
????????京樓盤直降5000?中信府?公園樓王現房<br>
????</div>
????<div>
????????40平出租屋大改造?美少女的混搭小窩<br>
????????經典清新簡歐愛家?90平老房煥發新生<br>
????????新中式的酷色溫情?66平撞色活潑家居<br>
????????瓷磚就像選好老婆?衛生間煙道的設計<br>
????</div>
????<div>
????????通州豪華3居260萬?二環稀缺2居250w甩<br>
????????西3環通透2居290萬?130萬2居限量搶購<br>
????????黃城根小學學區僅260萬?121平70萬拋!<br>
????????獨家別墅280萬?蘇州橋2居優惠價248萬<br>
????</div>
</div>
</body>
</html>
2016-12-25
this指的是該方法的調用者,如果你寫成oLis(i),按照循環i從0開始(房產),但是我可以從i=2(二手房)開始啊。