title: javascript（DOM常用方法）
date: 2017-06-01 10:31:19
tags: javascript筆記
DOM操作的一些常用屬性和方法
元素節點的nodeType是1
屬性節點的nodeType是2
文本節點的nodeType是3
節點的獲取
childNodes：獲取某個元素下的所有子節點，包含文本節點和元素節點。
children：獲取某個元素下的所有元素子節點。
nextElementSibling：獲取元素的下一個兄弟元素節點。
previousElementSibling：獲取元素的上一個兄弟元素節點。
firstElementChild：獲取元素下的第一個元素子節點。
lastElementChild：獲取元素下的第一個元素子節點。
parentNode：獲取元素的父節點。
nodeValue：查看節點的屬性值。
nodeName：查看節點的屬性名。
nodeType：查看節點的類型。
屬性的獲取和設置
offsetParent：獲取最近有定位屬性的祖先節點。如果沒有直接獲取body。
offsetLeft：左外邊框到有定位的最近的父級元素的內邊框的距離。不帶px單位。父級沒有帶定位的就是到body的距離。
offsetTop：上外邊框到有定位的最近的父級元素的內邊框的距離。不帶px單位。父級沒有帶定位的就是到body的距離。
getAttribute()：獲取元素的行內設置的屬性值。參數是屬性名。
setAttribute()：設置元素的行內設置的屬性值。參數是屬性名和屬性值。
removeAttribute()：刪除元素的行內設置的屬性值。參數是屬性名。
getBoundingClientRect()： 當前元素距離body的四個方向的距離和寬高的對象。獲取的值會隨着頁面滾動位置而改變。值是不帶單位的。
clientWidth：獲取元素不計算邊框的寬度。document.documentElement.clientWidth是瀏覽器窗口可是區域的寬度。
clientHeight：獲取元素不計算邊框的高度。document.documentElement.clientHeight是瀏覽器窗口可是區域的高度。
offsetWidth：獲取元素計算邊框的寬度。
offsetHeight：獲取元素計算邊框的高度。
操作節點
document.createElement()：創建一個元素節點，參數是元素的名稱，字符串格式。
appendChild()：將一個元素節點添加到另一個元素節點的最後，格式爲父節點.appendChild(要添加的節點)。
insertBefore()：將一個元素節點添加到一個元素節點的指定子節點的前面。格式爲父節點.insertBefore(要添加的節點,添加到這個節點之前)，假如第二個參數是不存在的，節點將會添加到父節點的最後。
removeChild()：刪除一個指定的元素子節點，如果指定的節點找不到會報錯。格式爲父節點.removeChild(要刪除的節點)。
replaceChild()：替換一個元素節點，格式是父節點.replaceChild(要添加的節點,被替換的節點)。
cloneNode()：克隆一個元素節點，默認只會克隆節點本身，不會克隆它的子節點，如果要將這個節點下的所有子節點也都克隆需要傳參數true，格式爲要克隆的節點.cloneNode(true)。
appendChild()、insertBefore()、replaceChild()在操作一個已有元素時，是將已有元素移動，而不是複製一份進行操作。
操作表格
對於表格的操作javascript提供了一些簡單的獲取方式。
假設table是已經獲取到的表格元素。
table.tHead：獲取表格頭部。
table.tFoot：獲取表格底部。
table.tBodies：獲取表格主體。
table.tBodiesn.rows[n]：獲取表格的行，就是tr。
table.tBodiesn.rows[n].cells[n]：獲取單元格，就是td。