語(yǔ)法：
for ( ① ; ② ; ④){
③
}
執(zhí)行順序：
1→2(true)→3→4→2(true)→3→4....→2(false)
①定義語(yǔ)句：定義一些變量，需要用這些變量控件我們的循環(huán)；
②判斷語(yǔ)句：只有當(dāng)判斷條件語(yǔ)句為true才能繼續(xù)往下執(zhí)行；
③循環(huán)體：整個(gè)大括號(hào)里面都是代碼，可能不止一句代碼！
-
④變化語(yǔ)句：變量的變化；
for( var x=0 ; x<10 ; x++){ alert( x ); }
x++ →x=x+1;
x-- → x=x-1;
也可以用 x +=2;
上面彈出 1~9；
for( var x=0 ; x<10 ; x++){
}
alert( x );
彈出10；
var x 放在外面跟里面一樣
例：5個(gè)盒子點(diǎn)擊任一個(gè)盒子彈出1
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<script type="text/javascript">
var aBox = document.getElementsByClassName( 'box' );
for( var i=0 ; i<=4 ; i++){
aBox[i].onclick = function(){
alert( 1 );
}
}
</script>
→注冊(cè)事件：就是已經(jīng)添加好了aBox[0] ~ aBox[4] 的點(diǎn)擊事件
等同于
aBox[0].onclick = function(){
alert( 1 );
}
aBox[1].onclick = function(){
alert( 1 );
}
aBox[2].onclick = function(){
alert( 1 );
}
aBox[3].onclick = function(){
alert( 1 );
}
aBox[4].onclick = function(){
alert( 1 );
}
關(guān)于點(diǎn)擊后i的多少
<script type="text/javascript">
var aBox = document.getElementsByClassName( 'box' );
for( var i=0 ; i<=4 ; i++){
aBox[i].onclick = function(){
alert( i );
}
} 彈出5；
</script>
為什么是5呢？
因?yàn)樯厦媸亲?cè)事件，在沒(méi)有點(diǎn)擊之前 function(){ alert( i ); }并沒(méi)有被執(zhí)行到，但for循環(huán)的i已經(jīng)執(zhí)行完了，這里再點(diǎn)擊觸發(fā)，這時(shí)候的i就是for循環(huán)結(jié)束時(shí)的i就是 5
跟之前 for( var x = 0 ; x < 3 ; x++){ } alert( x ); 一樣；
如果點(diǎn)擊要彈出對(duì)應(yīng)的位置
利用自定義屬性：一個(gè)對(duì)象可以通過(guò)添加一個(gè)原來(lái)沒(méi)有的屬性用來(lái)存值；
注意：
- 合法標(biāo)簽屬性 title id class ... 類(lèi)似這些
- 自定標(biāo)簽屬性
→這兩個(gè)能在標(biāo)簽上體現(xiàn)
- 自定義屬性（只存在js里面體現(xiàn)）
例：
aBox[0].title ='';不能用title等合法標(biāo)簽屬性來(lái)做自定義屬性，因?yàn)檫@樣相當(dāng)于操作標(biāo)簽屬性了，會(huì)再HTML里體現(xiàn)出來(lái)；
aBox[0].goudan = 1; → 存值
<script type="text/javascript">
var aBox = document.getElementsByClassName( 'box' );
for( var i=0 ; i<=4 ; i++){
aBox[i].ali = i;
aBox[i].onclick = function(){
alert( this.ali );
}
}
</script>
等同于
aBox[0].ali = 0;
aBox[0].onclick = function(){ alert( this.ali ); }
aBox[1].ali = 1;
aBox[1].onclick = function(){ alert( this.ali ); }
aBox[2].ali = 2;
aBox[2].onclick = function(){ alert( this.ali ); }
aBox[3].ali = 3;
aBox[3].onclick = function(){ alert( this.ali ); }
aBox[4].ali = 4;
aBox[4].onclick = function(){ alert( this.ali ); }
點(diǎn)擊哪個(gè)就會(huì)彈對(duì)應(yīng)的哪個(gè)的位置值
這里的ali不是數(shù)組，只是不同主人的ali
aBox[0].ali ?aBox[1].ali ? aBox[2].ali ? aBox[3].ali ? aBox[4].ali
