這部分基本與Java一致
~~~
<script>
var i = 0;
i++;
if(i === 5){
i = 0;
}
i%=5;
</script>
~~~
這里出現了===，我們稱為全等，它與==的區別就是，==之比較值，不比較類型，而===必須值和類型完全對應才返回true
課后練習-1：li循環給不同的顏色（例如：紅黃藍--紅黃藍--紅黃藍....），鼠標移入顏色變化，鼠標移開顏色返回
方案一：索引值
方案二：字符串記錄顏色
~~~
<script>
window.onload = function () {
var aLi = document.getElementsByTagName('li');
var arr = ['red','yellow','blue'];
var str = '';
for(var i = 0;i < aLi.length;i++){
aLi[i].index = i;
aLi[i].style.background = arr[i%arr.length];
aLi[i].onmouseover = function () {
str = this.style.background;
this.style.background = '#ccc';
}
aLi[i].onmouseout= function () {
this.style.background = str;
//this.style.background = arr[this.index%arr.length];
}
}
}
</script>
~~~
課后練習-2：針對上個練習進行拓展，點擊選中是黑色，移開也是黑色，再點擊其他，新點的是黑色，上次的黑色還原
~~~
<script>
window.onload = function () {
var aLi = document.getElementsByTagName('li');
var arr = ['red', 'yellow', 'blue'];
var str = '';//記錄舊顏色
for (var i = 0; i < aLi.length; i++) {
aLi[i].index = i;
aLi[i].active = false;
aLi[i].style.background = arr[i % arr.length];
aLi[i].onmouseover = function () {
if(!this.active){
str = this.style.background;
}
this.style.background = '#ccc';
}
aLi[i].onmouseout = function () {
if(!this.active){
this.style.background = str;
}else{
this.style.background = '#000';
}
//this.style.background = arr[this.index%arr.length];
}
aLi[i].onclick = function () {
for(var i = 0;i < aLi.length;i++){
if(aLi[i].active){
aLi[i].active = false;
aLi[i].style.background =arr[i%arr.length];
}
}
this.active = true;
this.style.background = '#000';
}
}
}
</script>
~~~
***
### 邏輯與&&、或||、非！
與Java完全一致
***
課后作業-1：反選小實例
~~~
<script>
window.onload = function () {
var aInp = document.getElementsByTagName('input');
// 加checked是可以的，但也有其他辦法
// oInp[1].checked = false;
aInp[0].onclick = function () {
for(var i = 1;i < aInp.length;i++){
// if(aInp[i].checked){
// aInp[i].checked = false;
// }else{
// aInp[i].checked = true;
// }
aInp[i].checked = !aInp[i].checked;
}
}
}
</script>
~~~
***
拓展練習-1：
拓展練習-2：
