## 怎樣添加、移除、移動、復制、創建和查找節點 (好多年前用的這些，自行百度) <br> #### 創建新節點 ~~~ document.createDocumentFragment()????//創建一個DOM片段 document.createElement()???//創建一個具體的元素 document.createTextNode()???//創建一個文本節點 ~~~ #### 添加、移除、替換、插入 ~~~ document.appendChild()??????//添加 document.removeChild()??????//移除 document.replaceChild()??????//替換 document.insertBefore()??????//插入 ~~~ #### 查找 ~~~javascript document.getElementsByTagName()????// 通過標簽名稱 document.getElementsByName()?????// 通過元素的Name屬性的值 document.getElementById()????????// 通過元素Id，唯一性 document.querySelector() // 可以通過選擇器獲取元素 document.querySelectorAll() // 可以通過選擇器獲取多個元素 ~~~ <br> ## 下面這個ul，如何點擊每一列的時候alert其index? ~~~ <ul id="test"> <li>這是第一條</li> <li>這是第二條</li> <li>這是第三條</li> </ul> ~~~ #### 方法1：推薦 ~~~ var ul = document.getElementById('test'); var lis = ul.getElementsByTagName('li'); for (var i = 0; i < lis.length; i++) { lis[i].index = i; lis[i].onclick = function () { console.log(this.index); }; } ~~~ #### 方法2： ~~~ var ul = document.getElementById('test'); var lis = ul.getElementsByTagName('li'); for (var i = 0; i < lis.length; i++) { lis[i].onclick = (function (n) { return function () { console.log(n); } }(i)); } ~~~ <br> ## 當一個DOM節點被點擊時候，我們希望能夠執行一個函數，應該怎么做？ <br> #### 直接在DOM里綁定事件 ~~~ <div onclick="test()"></div> ~~~ #### 在JS里通過onclick綁定 ~~~ xxx.onclick = test ~~~ #### 通過事件添加進行綁定 ~~~ xxx .addEventListener(‘click’, test) ~~~ <br>