1. 偽陣列arguments
arguments代表的是實參，有個講究的地方是：arguments只在函式中使用，
1.1 回傳引數個數
回傳函式實參的個數：arguments.length
例子：
fn(2,4); fn(2,4,6); fn(2,4,6,8); function fn(a,b,c) { console.log(arguments); console.log(fn.length); //獲取形參的個數 console.log(arguments.length); //獲取實參的個數 console.log("----------------"); }
結果：
1.2 只能修改元素，不能修改長短
之所以說arguments是偽陣列，是因為：arguments可以修改元素，但不能改變陣列的長短，
例子：
fn(2,4); fn(2,4,6); fn(2,4,6,8); function fn(a,b) { arguments[0] = 99; //將實參的第一個數改為99 arguments.push(8); //此方法不通過，因為無法增加元素 }
清空陣列的幾種方式：
var array = [1,2,3,4,5,6]; array.splice(0); //方式1：洗掉陣列中所有專案 array.length = 0; //方式1：length屬性可以賦值，在其它語言中length是只讀 array = []; //方式3：推薦
2. DOM的時間操作
2.1 JavaScript的組成
JavaScript基礎分為三個部分：
ECMAScript：JavaScript的語法標準，包括變數、運算式、運算子、函式、if陳述句、for陳述句等，
DOM：檔案物件模型，操作網頁上的元素的API，比如讓盒子移動、變色、輪播圖等，
BOM：瀏覽器物件模型，操作瀏覽器部分功能的API，比如讓瀏覽器自動滾動，
2.2 事件
JS是以事件驅動為核心的一門語言，
2.2.1 事情的三要素
事件的三要素：事件源、事件、事件驅動程式，
比如，我用手去按開關，燈亮了，這件事情里，事件源是：手，事件是：按開關，事件驅動程式是：燈的開和關，
再比如，網頁上彈出一個廣告，我點擊右上角的X，廣告就關閉了，這件事情里，事件源是：X，事件是：onclick，事件驅動程式是：廣告關閉了，
于是我們可以總結出：誰引發的后續事件，誰就是事件源，
總結如下：
事件源：引發后續事件的html標簽，
事件：js已經定義好了（見下圖），
事件驅動程式：對樣式和html的操作，也就是DOM，
代碼書寫步驟如下：
（1）獲取事件源：document.getElementById(“box”); //類似與ios語言的 UIButton *adBtn = [UIButton buttonWithType:UIButtonTypeCustom];
（2）系結事件： 事件源box.事件onclick = function(){ 事件驅動程式 };
（3）書寫事件驅動程式：關于DOM的操作
代碼舉例：
<body>
<div id="box1"></div>
<script type="text/javascript">
// 1、獲取事件源
var div = document.getElementById("box1");
// 2、系結事件
div.onclick = function () {
// 3、書寫事件驅動程式
alert("我是彈出的內容");
}
</script>
</body>
常見事件如下：
下面針對這事件的三要素，進行分別介紹，
2.2.2 獲取事件源的方式（DOM節點的獲取）
獲取事件源的常見方式如下：
var div1 = document.getElementById("box1"); //方式一：通過id獲取單個標簽 var arr1 = document.getElementsByTagName("div1"); //方式二：通過 標簽名 獲得 標簽陣列，所以有s var arr2 = document.getElementsByClassName("hehe"); //方式三：通過 類名 獲得 標簽陣列，所以有s
2.2.3 系結事件的方式
方式1：直接系結匿名函式
<div id="box1" ></div>
<script type="text/javascript">
var div1 = document.getElementById("box1");
//系結事件的第一種方式
div1.onclick = function () {
alert("我是彈出的內容");
}
</script>
方式2：先單獨定義函式，再系結
<div id="box1" ></div>
<script type="text/javascript">
var div1 = document.getElementById("box1");
//系結事件的第二種方式
div1.onclick = fn; //注意，這里是fn，不是fn()，fn()指的是回傳值，
//單獨定義函式
function fn() {
alert("我是彈出的內容");
}
</script>
注意上方代碼的注釋，系結的時候，是寫fn，不是寫fn()，fn代表的是整個函式，而fn()代表的是回傳值，
方式3：行內系結
<!--行內系結-->
<div id="box1" onclick="fn()"></div>
<script type="text/javascript">
function fn() {
alert("我是彈出的內容");
}
</script>
注意第一行代碼，系結時，是寫的"fn()"，不是寫的"fn"，因為系結的這段代碼不是寫在js代碼里的，而是被識別成了字串，
2.2.4 事件驅動程式
我們在上面是拿alert舉例，不僅如此，我們還可以操作標簽的屬性和樣式，
舉例如下：
<style> #box { width: 100px; height: 100px; background-color: pink; cursor: pointer; } </style> </head> <body> <div id="box" ></div> <script type="text/javascript"> var oDiv = document.getElementById("box"); //點擊滑鼠時，原本粉色的div變大了，背景變紅了 oDiv.onclick = function () { oDiv.style.width = "200px"; //屬性值要寫引號 oDiv.style.height = "200px"; oDiv.style.backgroundColor = "red"; //屬性名是backgroundColor，不是background-Color } </script>
上方代碼的注意事項：
在js里寫屬性值時，要用引號
在js里寫屬性名時，是
backgroundColor，不是CSS里面的background-Color，記得所有的像css屬性的text-*，line-*、backgroun-*等在js中都寫成駝峰
2.2.5 onl oad事件
當頁面加載（文本和圖片）完畢的時候，觸發onload事件，
舉例：
<script type="text/javascript"> window.onload = function () { console.log("小馬哥"); //等頁面加載完畢時，列印字串 } </script>
有一點我們要知道：js的加載是和html同步加載的，因此，如果使用元素在定義元素之前，容易報錯，這個時候，onload事件就能派上用場了，我們可以把使用元素的代碼放在onload里，就能保證這段代碼是最后執行，
建議是：整個頁面上所有元素加載完畢在執行js內容，所以，window.onload可以預防使用標簽在定義標簽之前，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/171277.html
標籤：JavaScript
上一篇：【hexo+github搭建myblog】bash: npm: command not found 問題，疑似解決！關鍵詞：NPM全域安裝路徑