js編程挑戰(zhàn)，選項(xiàng)卡切換效果。
window.onload=function(){
????????var?otab=document.getElementById("tabs");
????????var?oli=document.getElementsByTagName("li");
????????var?div=otab.getElementsByTagName("div");
????????for(var?i=0;i<oli.length;i++){
????????????oli[i].index=i;???????????
????????????oli[i].onclick=function(){
????????????????for(var?j=0;j<oli.length;j++){
????????????????????oli[j].className="";
????????????????????div[j].className="hide";
????????????????}
????????????this.className="on";
????????????div[this.index].className="";
????????????}
????????}
????}關(guān)于這里面的this是代表onload的document，還是循環(huán)里的oli啊，然后為什么第一層里面需要使用到this.classname ?div[this.index].classname啊 ?主要是不理解第二層和第一層區(qū)別的this 和div[里的index和i的不同]
2016-07-20
這里是將當(dāng)前的i保存到每個(gè)對(duì)象的index屬性中，目的就是在onclick事件中，點(diǎn)擊每個(gè)選項(xiàng)卡獲取當(dāng)前這個(gè)選項(xiàng)卡所對(duì)應(yīng)內(nèi)容的索引。i就是當(dāng)前選項(xiàng)卡所對(duì)應(yīng)的內(nèi)容的索引。
? ? ? ? ? ? ? ? ?這個(gè)for循環(huán)在文檔加載完成時(shí)就已經(jīng)開(kāi)始執(zhí)行，并且執(zhí)行完了，所以，這個(gè)i最后是3，所以oDivs[i]中的這個(gè)i=3,oDivs中根本就沒(méi)有索引為3的元素，所以會(huì)報(bào)undefined錯(cuò)誤，要想獲取當(dāng)前選項(xiàng)卡的索引，就需要將當(dāng)前的i保存到?jīng)]有oLis對(duì)象里面，如代碼：oLis[i].index = i;
2016-07-20
這里面的this代表的是循環(huán)里的oli里面的元素，this.classname ?div[this.index].classname中的this都是當(dāng)前的oli[i]，是同一個(gè)