for (var i = 0; i < 10; i++) {
alert(i);
}
alert(i); //10
因?yàn)閖s里沒有塊級(jí)作用域,所以for循環(huán)里定義的變量也存在于循環(huán)外部的執(zhí)行環(huán)境中;i <10,是進(jìn)入循
環(huán)的條件,最后一次進(jìn)入循環(huán)時(shí)i = 9,然后i++變成10,不滿足進(jìn)入循環(huán)的條件,所以i最后的值是10
- window.onload載入
- 取出所需的各個(gè)變量
- 循環(huán)遍歷12個(gè)月份數(shù)組,自定義一個(gè)index,定義鼠標(biāo)滑過函數(shù)
- 在鼠標(biāo)滑過函數(shù)里再次遍歷12個(gè)月份數(shù)組,將class設(shè)為none,通過this.className給當(dāng)前選擇的月份添加class
- 文本框里的內(nèi)容用一個(gè)數(shù)組存放,通過(index+1)獲取月份、array[this.index]獲取數(shù)組里對(duì)應(yīng)月份的內(nèi)容、innerHTML插入到文本框、并用+加號(hào)拼接。
// js部分代碼
window.onload = function() {
var oDiv = document.getElementById("div1");
var oUl = oDiv.getElementsByTagName("ul")[0];
var aLi = oUl.getElementsByTagName("li");
var oText = oDiv.getElementsByTagName("div")[0];
for (var i = 0; i < aLi.length; i++) {
aLi[i].index = i;
aLi[i].onmouseover = function() {
for (var i = 0; i < aLi.length; i++) {
aLi[i].className = "";
};
this.className = "active";
oText.innerHTML = "<h2>" + (this.index+1) +"月活動(dòng)</h2><p>" +array[this.index] +"</p>"
}
在線demo
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。