每日小結2.26

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(某個子節點)
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 一、JS前言 (1)認識JS 也許你已經了解HTML標記(也稱為結構),知道了CSS樣式(也稱為表示),會使用HT...
    凜0_0閱讀 2,798評論 0 8
  • 原文 https://www.kancloud.cn/dennis/tgjavascript/241852 一、節...
    LuckyS007閱讀 862評論 0 0
  • 思考為什么 一,為什么會區分出預備群和正式群? 【思考】 我覺得貓叔區分出正式群和預備群,一定是有他的原因的。細想...
    檀子_閱讀 1,208評論 7 32
  • 16年前讀《挪威的森林》,讀了一小半,不甚了了,于是就放下了,一下子放了16年,前天重新拿起來,熬夜讀完,心有戚戚...
    純棉有喜閱讀 263評論 0 0
  • *心情覺得好煩躁啊,你看又能量對撞了,看看發生了什么事 *前天和男友有小爭執,發現他有時候對我的態度心在不焉,覺得...
    童欣怡_中閱讀 349評論 2 0