1. 三個元素不用找，可直接獲得:
document.documentelement
document.head
document.body
2. 節點間關係: 2大類： （不常用）
何時: 只要已經獲得了乙個節點，找周圍節點時
節點樹: 包含所有節點(元素,文字)的完整的樹結構
1. 父子關係: elem.parentnode 返回乙個父節點物件
elem.childnodes 返回子節點物件的集合
elem.firstchild 返回第乙個子節點物件
elem.lastchild 返回最後乙個子節點物件
2. 兄弟關係:
elem.previoussibling : 返回當前節點的前乙個兄弟節點
elem.nextsibling : 返回當前節點的下乙個兄弟節點:
問題: 不但包含有用的元素節點，還包含看不見的換行/空格干擾
解決: 今後只要僅關心元素節點時，就可用元素樹
元素樹: 僅包含元素節點的樹結構
1. 父子關係: elem.parentelement 返回乙個父元素物件
elem.children 返回子元素物件的集合
elem.firstelementchild 返回第乙個子元素物件
elem.lastelementchild 返回最後乙個子元素物件
2. 兄弟關係:
返回當前節點的前乙個兄弟元素
elem.previouselementsibling :
返回當前節點的下乙個兄弟元素:
elem.nextelementsibling :
***elem.childnodes和elem.children返回的都是動態集合:
動態集合(live collection): 不實際儲存元素和屬性值
每次訪問集合都重新查詢dom樹
遍歷動態結合:
錯誤: for(var i=0;i3. 遞迴遍歷: 查詢指定父節點下所有子代節點——鄙視題 手寫（不常用）
如何: 2步:
1. 先遍歷所有直接子節點
2. 在遍歷直接子節點時，對每個子節點呼叫和父節點完全相同的方法。
演算法: 深度優先遍歷: 每次都優先遍歷子節點
所有子節點遍歷完，才返回遍歷兄弟節點
遞迴的效率: 極低。
解決: 絕大多數遞迴都可用迴圈代替
遍歷api: 每次僅遍歷下乙個節點，可用迴圈反覆執行(了解)
1. 節點迭代器:
如何: 2步:
1. 建立迭代器物件:
var iterator=document.createnodeiterator(
parent,nodefilter.show_all, null, false
.show_element
);2. var 原先的節點物件=
iterator.nextnode(); 跳到下乙個節點
如果返回null，說明到頭了
內建的就是深度優先遍歷演算法。
4. 按html查詢: 在整個頁面或指定父元素下，查詢屬性或標籤符合要求得元素物件。（常用）
何時: 只要按基本的條件有選擇的查詢元素時
4種:
1. 按id查詢:
var elem=document.getelementbyid("id");
強調: 只能用document呼叫！
僅返回乙個元素!
2. 按標籤名查詢:
var elems=parent.getelementsbytagname("標籤名");
強調: 任何父元素都能呼叫！
返回父元素下所有同名標籤的元素的集合!
即使僅返回乙個元素，也會放在集合中
如果想取出唯一的乙個元素，必須加[0]
不僅查詢直接子節點，而且查詢所有子代節點
3. 按name屬性查詢: (了解)
var elems=document.getelementsbyname("name");
4. 按class屬性查詢: (了解) (相容性問題)
var elems=parent.getelementsbyclassname("class");
5. 按選擇器查詢:
① 如果只找乙個:
var elem=parent.queryselector("selector");
② 如果找多個:
var elems=parent.queryselectorall("selector");
返回非動態集合(non-live collection):
實際儲存完整資料，反覆訪問，也不用重新查詢dom樹
優: 不會造成反覆查詢
鄙視題: getelements***x vs queryselector
1. 返回值:
getelements返回動態集合:
優: 首次查詢效率高
缺: 可能造成反覆查詢dom樹
queryselector返回非動態集合:
優: 包含完整屬性，無需反覆查詢dom樹
缺: 首次查詢效率低
2. 易用性:
queryselector更靈活, 且更簡單
getelements每次只能查詢一種結果，無法設定查詢條件
更繁瑣總結: jquery中:
如果一次查詢就能找到元素時，首選getelements
如果查詢條件複雜時，就用queryselector
DOM詳解 三 DOM修改
1.innerhtml 獲取或設定元素開始標籤到結束標籤之間的html 片段。2.textcontent 獲取或設定元素開始標籤到結束標籤之間的純文字內容。2件事 1.去掉了html標籤 2.將轉義字元轉換為正文 何時 如果希望去掉內容中的標籤，僅獲取文字內容時 textcontent有相容性問題 ...
DOM基礎詳解
認識dom 是什麼 文件物件模型 為什麼 w3c推出，為了相容瀏覽器，替代dhtml 文件型別 gml 通用標記語言 sgml 標準通用標記語言 html 超文字標記語言，用於顯示資料 xml 可擴充套件標記語言，用於描述資料 節點 節點型別 基礎 元素節點1 屬性節點2 文字節點3 注釋節點8 文...
DOM 查詢標籤
1 直接查詢 document.getelementbyid 根據id獲取乙個標籤 document.getelementsbyclassname 根據class屬性獲取 document.getelementsbytagname 根據標籤名獲取標籤合集 var ele p document.get...