DOM基礎

• childNodes
  返回指定元素的子元素集合，在IE6-8下，只返回元素節點，在IE9和chrome下會連同文本節點一起返回，所以需要通過if判斷obj[i] == 1，來篩選元素節點。
• children
  返回指定元素子元素的集合，只包括元素節點，且是一級子元素
• nodeType
  返回節點類型
• parentNode
  返回父節點，可以做點擊隱藏父節點
• offsetParent
  返回一個指向最近的包含該元素的定位元素，比如一個元素position為absolute，使用element.offsetParent可以知道該元素相對誰定位
• firstChild和firstElementChild
  用于選取改元素的第一個子元素，前者支持ie6-8，后者支持高級瀏覽器，相似的還有lastChild和lastElementChild、nextSibling和nextElementSibling（下一個兄弟元素）、previousSibling和previousElementSibling
• getAttribute(屬性名稱)
  獲取元素的屬性
• setAttribute（屬性名稱，屬性值）
  設置屬性值
• 通過className選擇元素

var aLi = document.getElementsByTagName("li");
for (var i = 0; i < aLi.length; i++) {
    if (aLi[i].className == "tored") {
        aLi[i].style.backgroundColor = "red";
}
}

封裝一個getByClass函數

function getByClass(parent, class) {
    var result = [];
    var aEle = parent.getElementsByTagName("*");
    for (var i = 0; i < aEle.length; i++) {
        if (aEle[i].className == class) {
        result.push(aEle[i]);
}
}
return result;
}

• createElement() 創建一個節點

var =createLi = document.createElement("li");

• appendChild() 向當前節點的子節點末尾添加新的子節點

node.appendChild(createLi)

• insertBefore() 在當前節點某個子節點之前再插入一個子節點

node.insertBefore(createLi, 某個子節點)

• removeChild() 刪除當前節點的某個子節點

node.removeChild(某個子節點)