window.onload?=?function()?{
????????var?oUl1?=?document.getElementById("ul1");????????????????????????
????????var?aLi?=?oUl1.getElementsByTagName("li");????????????????????????//這一句和上一句是為了獲得三個標題的標簽??aLi是一個長度為3的數組里面是
????????var?oDiv?=?document.getElementById("tab-list");
????????var?aDiv?=?oDiv.getElementsByTagName("div");??????????????????//這一句和上一句是為了獲得選項卡內容所在的塊的標簽???aDiv也是一個長度為三的數組
????????for(var?i?=?0;?i?<?aLi.length;?i++)?{
????????????aLi[i].index?=?i;????????????????????????????????????????????//以標題為基礎??遍歷所有標題?每個標題給個序號index??作為后面div數組的下標
????????????aLi[i].onmouseover?=?function()?{????????????????????????????//這里設置鼠標在標題上劃過的時候的事件
????????????????for(var?i?=?0;?i?<?aLi.length;?i++)?{
????????????????????aLi[i].className?=?"";????????????????????????????????//這里把所有的標題都改成沒被選中的時候的類???相當于一種清空的作用??防止上次選中的在這次還被顯示
????????????????}
????????????????this.className?=?"active";????????????????????????????????//這句就單獨把選中的標題改成選中狀態的類??這里的this是函數開始的時候的aLi[i]
????????????????for(var?j?=?0;?j?<?aDiv.length;?j++)?{????????????????????//同上??先把所有內容塊都先改成沒被選中狀態的類
????????????????????aDiv[j].className?=?"hide";????
????????????????}
????????????????aDiv[this.index].className?=?"show";??????????????????????//同上??單獨把選中的內容塊改成選中狀態的類
????????????}????????
????????}
????}