<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>實(shí)踐題?-?選項(xiàng)卡</title>
????<style?type="text/css">
?????/*?CSS樣式制作?*/??
?????*{
?????????margin:0;
?????????padding:0;
?????????font-size:12px?normal?"microsoft?yahei";
?????}
?????#xxk{
?????????width:290px;
?????????height:150px;
?????????margin:20px;
?????????padding:5px;
?????}
?????#xxk?ul{
?????????list-style:none;
?????????display:block;
?????????height:30px;
?????????line-height:30px;
?????????border:2px?saddlebrown?solid;
?????}
?????#xxk?ul?li{
?????????float:left;
?????????background:#fff;
?????????cursor:pointer;
?????????height:28px;
?????????line-height:28px;
?????????border:1px?#aaa?solid;
?????????margin:0?3px;
?????????border-bottom:none;
?????????display:inline-block;
?????????width:60px;
?????????text-align:center;
?????????list-style:none;
?????}
?????ul?li.on{
?????????border-top:2px?solid?saddlebrown;
?????????border-bottom:2px?solid?#fff;
?????}
?????#xxk?div{
?????????height:120px;
?????????line-height:25px;
?????????border:1px?solid?#336699;
?????????border-top:none;
?????????padding:5px;
?????}
?????.hides{
?????????display:none;
?????}
????</style>
????<script?type="text/javascript">
?????????
????//?JS實(shí)現(xiàn)選項(xiàng)卡切換
????window.onload=function(){
????????var?oTab=document.getElementById("xxk");
????????var?oul=oTab.getElementsByTagName("ul")[0];
????????var?oli=oul.getElementsByTagName("li");
????????var?odivs=oTab.getElementsByTagName("div");
????????
????????????for(var?i=0,len=oli.length;i<len;i++){
????????????????oli[i].index=i;
????????????????oli[i].onclick=function(){
????????????????????for(var?n=0;n<len;n++){
????????????????????????oli[n].className="";
????????????????????????odivs[n].className="hides";
????????????????????}
????????????????????this.className="on";
????????????????????odivs[this.index].className="";
????????????????}
????????????};
????????????
????}
????
????</script>
?
</head>
<body>
<!--?HTML頁面布局?-->
<div?id="xxk">
????<ul>
????????<li>房產(chǎn)</li>
????????<li>家居</li>
????????<li>二手房</li>
????</ul>
<div>
????<p>
?????????275萬購昌平鄰鐵三居?總價20萬買一居<br?/>
?????????200萬內(nèi)購五環(huán)三居?140萬安家東三環(huán)<br?/>
?????????北京首現(xiàn)零首付樓盤?53萬購東5環(huán)50平<br?/>
?????????京樓盤直降5000?中信府?公園樓王現(xiàn)房
????</p>
</div>
<div>
????<p>
????????40平出租屋大改造?美少女的混搭小窩<br?/>
????????經(jīng)典清新簡歐愛家?90平老房煥發(fā)新生<br?/>
????????新中式的酷色溫情?66平撞色活潑家居<br?/>
????????瓷磚就像選好老婆?衛(wèi)生間煙道的設(shè)計(jì)
????</p>
</div>
<div>
????<p>
????????通州豪華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)惠價248萬
????</p>
</div>
</div>
</body>
</html>
2016-05-18
i 是一個從0開始到數(shù)組長度減一的一個整數(shù)。
index一般是當(dāng)成元素下標(biāo)使用。不過你這種用法,沒見過,也不清楚有什么意義。
我寫了個測試?yán)樱?/p>
var aa=new Array("a","b","c");
? ? ? ? aa[0].index=1;
? ? ? ? console.log(aa[0]+" "+aa[1]+" "+aa[2]);
打印出來 :a b c
?沒發(fā)現(xiàn)這句代碼有什么用意。
?