js的陣列

1.陣列：陣列就是一組資料的集合,其表現形式就是記憶體中的一段連續的記憶體地址,陣列名稱其實就是連續記憶體地址的首地址。

（2） 陣列是資料的倉庫，length為陣列資料的數量

（3）["第一個資料","第二個資料","第三個資料"]

（4） arr[下標]為陣列下標位置的資料（從0開始）

（5）arr.push("第四個資料")向陣列最後一位後新增資料

用標籤名獲取元素：document.getElementsByTagName("");

特點：陣列定義時無需指定資料型別，陣列定義時可以無需指定陣列長度，陣列可以儲存任何資料型別的資料。

練習1：用陣列做一個圖片控制左右按鈕來進行切換

<input type="button" value="左"/>
<input type="button" value="右"/></br>
<img src="1.png" width="400" height="300"/>
<script>
var arr=["1.png","2.png","3.png","4.png"]
var aBtn=document.getElementsByTagName("input");
var oImg=document.getElementsByTagName("img")[0];
var i=0;
aBtn[0].onclick=function(){
		if(i>0){
			i--;
		}
		else{i=3}
		oImg.src=arr[i];
}
aBtn[1].onclick=function(){
	if(i<3){
		i++;
	}
	else{i=0}
	oImg.src=arr[i];
}
</script>
 

布林值開關

布林值就是true和false

關於一些布林值開關的練習：

練習1：通過布林值開關來改變顏色。

<div id="div1"></div>
<script>
var oDiv=document.getElementById("div1");
var Bon=true;
oDiv.onclick=function(){
	Bon?oDiv.style.backgroundColor="blue":oDiv.style.backgroundColor="red";
	Bon=!Bon;
	}
</script>

這個就是當點選div 塊的時候，讓它的顏色有紅色變為藍色，這時候我們需要對顏色來判斷，讓它是紅色的時候改變它的顏色變為藍色就可以了，藍色時在變回紅色，但是卻不能直接通過顏色值來進行判斷

練習2：做一個下拉框，讓它點選時相應的展開隱藏。

<input type="button" value="展示"/>
<div></div>
<script>
var oDiv=document.getElementsByTagName("div")[0];
var oInpt=document.getElementsByTagName("input")[0];
var bOn=true;
oInpt.onclick=function(){
		oDiv.style.display=bOn?"block":"none";
		oInpt.value=bOn?"收回":"展示";
		bOn=!bOn;
}
</script>