《JavaScript DOM 編程藝術》（第二版）讀書筆記（二）

時間 2019-11-24

標籤 javascript dom 編程藝術第二讀書筆記欄目 JavaScript 简体版

原文原文鏈接

接下來正式進入DOM的學習javascript

第三章 DOMhtml

D表明document（文檔），O表明object（對象），M表明model（模型），簡單的說DOM把一份文檔表示成一顆「樹」（數學上的概念）.java

節點(node),它表示一個網絡的鏈接點。一個網絡就是由一些節點構成的集合。DOM也是一樣的狀況，文檔是由節點構成的集合.node

1.元素節點(element node)數組

<html>、<head>、<body>、<p>、<ul>等標籤的名字就是元素的名字，好比文本段落元素名字是「p」瀏覽器

2.文本節點(text node) 通常文本節點包含在元素節點裏面網絡

3.屬性節點(attribute node) 屬性節點也包含在元素節點裏，好比最多見的class,id性能

每一個節點都是一個對象學習

獲取元素的方法spa

1.document.getElementById

2.document.getElementsByTagName

3.document.getElementsByClassName

第一種方法比較簡單，第二種方法須要注意的是獲得的結果是一個數組，第三個方法比較新，舊的瀏覽器版本沒有支持，但能夠用原有的方法實現，代碼以下

function getElementsByClassName(node,classname){ if(node.getElementsByClassName){                               //若是瀏覽器支持原生的方法，則直接用原生的方法
        return node.getElementsByClassName(classname); }else{ var results = new Array(); var elems = node.getElementsByTagName("*"); for(var i = 0; i < elems.length; i++){ if(elems[i].className.indexOf(classname)!=-1){ results[results.length]=elems[i]; } } return results; 
}