一.Node類型
DOM定義了Node接口，由DOM中所有節點類型實現。JS中的所有節點類型都繼承自Node類型，因此所有節點類型共享基本的屬性和方法。
nodeType屬性：每個節點都有一個nodeType屬性，用於表明節點的類型。12種，如下：最常用的是元素和文本節點
元素節點 Node.ELEMENT_NODE(1)
屬性節點 Node.ATTRIBUTE_NODE(2)
文本節點 Node.TEXT_NODE(3)
CDATA節點 Node.CDATA_SECTION_NODE(4)
實體引用名稱節點 Node.ENTRY_REFERENCE_NODE(5)
實體名稱節點 Node.ENTITY_NODE(6)
處理指令節點 Node.PROCESSING_INSTRUCTION_NODE(7)
註釋節點 Node.COMMENT_NODE(8)
文檔節點 Node.DOCUMENT_NODE(9)
文檔類型節點 Node.DOCUMENT_TYPE_NODE(10)
文檔片段節點 Node.DOCUMENT_FRAGMENT_NODE(11)
DTD聲明節點 Node.NOTATION_NODE(12)節點關係：1.每個節點有一個childNodes屬性，其中保存一個NodeList對象，這是一種類數組對象（但不是Array的實例），用於保存一組有序節點。它是基於DOM結構動態執行查詢的結果，dom結構的變化能自動反映在此對象中。
訪問NodeList中節點的方法：方括號語法和item()方法。如someNode.childNodes[0]或someNode.childNode.item(0)。childNodes中的每個節點相互之間是同胞節點，通過previousSibling和nextSibling來訪問其他節點。hasChildNodes()方法，在節點包含一個及以上的子節點時返回true。2.每個節點都有parentNode屬性，指向文檔樹的父節點。父節點的firstChild和lastChild的屬性分別指向childNodes的第一個和最後一個節點。
操作節點：appendChild()：向childNodes列表的末尾添加一個節點，返回新增的節點。如果傳入到appendChild()中的節點已經是文檔的一部分，則將節點從原位置轉移到新位置。
insertBefore()：添加節點到特定的位置，接收兩個參數，要插入的節點和作爲參照的節點，被插入的節點會成爲參照節點的前一個同胞節點。若參照節點爲null則等同於appendChild。
replaceChild()：替換節點，接收兩個參數，要插入的節點和要替換的節點。
removeChild()：移除節點，返回被移除的節點。
注：以上方法是操作子節點的，必須先取得父節點。還有一些其他操作方法，是所有類型的節點都有的：
cloneNode()：創建調用這個方法的節點的一個完全相同的副本。接收一個布爾值參數，true表示執行深複製，複製節點及整個子節點樹；false淺複製，只複製節點本身。複製後返回的節點副本屬於文檔所有但是未指明父節點，因此算孤立節點，除非通過appendChild()添加到文檔中。注：此方法不會複製添加到DOM節點中的js屬性如事件處理程序等。
normalize()：處理文檔樹中的文本節點。
二.Document類型
js通過Document類型表示文檔，在瀏覽器中document對象是HTMLDocument（繼承自Document類型）的一個實例，表示整個HTML頁面。
文檔的子節點：documentElement屬性：始終指向html頁面的<html>元素；body屬性：直接指向<body>元素，document.body；doctype屬性：指向<!doctype>標籤
文檔信息：title屬性：指向<title>。接下來的三個屬性與對網頁的請求有關，所有這些信息都存在於請求的http頭部，通過js的這些屬性訪問：
URL屬性：包含完整url；
domains屬性：只包含域名；
referrer屬性：保存連接到當前頁面的那個頁面的url；
查找元素：getElementById()：參數大小寫嚴格匹配，找不到返回null。多元素ID值相同只返回第一個。
getElementsByTagName()：返回包含零個或多個元素的NodeList。在html文檔中返回HTMLCollection對象，這個對象有一個方法namedItem()，可以 通過元素的name特性取得集合中的項。如：<img src="***" name="myimg"> --->> var images = document.getElementsByTagName('img'); var myimg = images.namedItem("myimg");直接用方括號語法也會在後臺調用這些方法，如images['myimg']
getElementsByName()：返回帶有給定name特性的元素。常用的情況是取得單選按鈕。
特殊集合：document.forms：包含文檔中的所有<form>元素；document.images：包含所有<img>元素
文檔寫入：write()原樣寫入、wirteln()在字符串末尾添加換行。如果在文檔加載結束後再調用document.write()則輸出的內容會重寫整個頁面。
open()和close()分別用於打開和關閉網頁的輸出流。
三.Element類型
四.Text類型
特徵：nodeType=3，nodeValue的值爲節點所包含的文本，可通過nodeValue或data屬性訪問文本。
length屬性，保存節點中字符的數目。
創建文本節點：document.createTextNode()；
規範化文本節點：一般情況下每個元素只有一個文本子節點，但也會由例外，normalize()規範文本節點，如果在一個包含兩個及以上文本節點的父元素上調用此方法，則會將文本節點合併成一個節點。
分割文本節點：splitText()：原文本包含從開始到指定位置之前的內容，新文本節點包含剩下內容，返回新文本節點。這是從文本中提取數據的一種常用的DOM解析技術。
五.DocumentFragment類型
文檔片段是一種輕量級的文檔，可以包含和控制節點，但是不會像完整的文檔那樣佔用額外資源。如果逐個添加元素，會導致瀏覽器反覆渲染新信息，爲避免可以先用一個文檔片段保存要創建的元素，再一次性將他們添加到文檔中。
創建：document.createDocumentFragment()；
六.Attr類型
元素的特性在DOM中以Attr來表示。儘管也是節點，但不認爲是DOM樹的一部分。Attr對象有三個屬性，name，value，specified（布爾值，區別特性是在代碼中指定的還是默認的）document.createAttribute()並傳入特性名稱可以創建新的特性節點，setAttributeNode()方法將新創建的特性添加到元素中去：element.setAttributeNode('attr');
最常用的方法：getAttribute()；setAttribute()；removeAttribute()；不建議直接訪問特性節點。
DOM操作技術
1.動態腳本
//外部文件
function loadScript(url) {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
document.body.appendChild(script)
}
loadScript('example.js')
//行內方式
var script = document.createElement('script');
script.type = 'text/javascript';
var code = "function sayhi() { alert('hi'); }";
try { script.appendChild(document.createTextNode code); }
catch { script.text = code; }
document.body.appendChild(script)
function loadStyle(url) {
var link = document.createElement('link');
link.rel = "stylesheet";
link.type = "text/css";
link.href = url;
var head = document.getElementsByTagName("head")[0];
head.appendChild(link);
}
loadStyle('example.css');