摘要：是針對和文檔的一個，描繪了一個層次化的節點樹，允許開發人員添加修改刪除節點的一部分。類型級定義了接口，該接口由中的所有節點類型實現。添加的這些屬性分別對應于每個元素中都存在的下列標準特性。

DOM是針對HTML和XML文檔的一個API，描繪了一個層次化的節點樹，允許開發人員添加、修改、刪除節點的一部分。

DOM將HTML和XML文檔描繪成一個有多個節點構成的結構，節點分為12種不同的節點類型，每種都擁有自己的特點、數據和方法，并且和其他節點存在著某種關系。

html元素稱為文檔元素，所有的元素都包含在文檔元素中，并且每個文檔只有一個html元素。

DOM1級定義了Node接口，該接口由DOM中的所有節點類型實現。這個接口在JavaScript中是作為Node類型實現的。因此JavaScript中所有的節點類型都繼承Node類型，所有的類型都共享著相同的基本屬性和方法。

Node.ELEMENT_NODE (1)

Node.ATTRIBUTE_NODE (2)

Node.TEXT_NODE (3)

Node.CDATA_SECTION_NODE (4)

Node.ENTITY_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)

11. Node.DOCUMENT_FRAGMENT_NODE (11)
12. Node.NOTATION_NODE (12)

由于IE沒有公開構造函數，因此上述代碼不能在IE中使用。所以為了確保跨瀏覽器的兼容性，判斷Node類型的方法如下：

    if(someNode.nodeType == 1){
        alert("this is a element node!");
    }

可以利用nodeName和nodeValue屬性了解node的具體信息，這兩個值和節點的類型有關。

    if(someNode.nodeType == 1){
        value = someNode.nodeName;
        //對于元素節點，nodeName保存的是元素的標簽名，nodeValue始終為null
    }

文檔中所有節點相互之間都有關系，包括父子關系，同胞關系。

每個節點都有childNodes屬性，保存著一個NodeList對象，NodeList是一種類數組的對象，可以使用childeNode[0]，childNode.item(1)來訪問，同時擁有length屬性，但并不是Array實例。

parentNode：指向文檔樹種的父節點

nextSibling：緊挨著當前節點的下一個節點

previousSibling：緊挨著當前節點的上一個節點

firstChild：表現某一節點的第一個節點，childNodes[0]

lastChild：表示某一節點的最后一個子節點,childeNodes[childNodes.length-1]

hasChildNodes()方法：判定一個節點是否有子節點，有返回true，沒有返回false

removeChild()方法：去除一個節點

appendChild()方法：添加一個節點，如果文檔樹中已經存在該節點，則將它刪除，然后在新位置插入

replaceChild(node1，node2)方法：從文檔樹中刪除指定的節點node2，插入節點node1，被替換的節點仍然在文檔中，但是沒有位置

insertBefore(node1，node2)方法：在指定節點node2的前面插入節點node1，并返回node1.如果已經存在，則刪除原來的，然后在新位置插入

cloneNode()方法復制一個節點，該方法有一個參數，true表示深復制，false表示淺復制。不會復制屬性，處理程序等。

document對象是HTMLDocument（繼承自Document類型）的一個實例，表示整個html頁面或其他基于xml的文檔。并且document是window對象的一個屬性，可以將其當做全局對象來訪問。

Document的子節點可以是DocumentType、Element、ProcessingInstructior或Comment，有兩個訪問節點的快捷方式:

documentElement，該屬性一直指向頁面中的html元素。

childNodes，直接訪問文檔元素。

document.body，直接指向body元素

doucment.doctype，取得標簽的信息

文檔類型是只讀的，而且它只有一個元素節點，通常早已存在。

document對象有一些標準的Document對象所沒有的屬性，提供了 document對象所表現的網頁的一些信息。

    
    //取得文檔標題
    var title = document.title;
    //設置文檔標題
    document.title = "New page title";
    //取得完整的URL
    var url = document.URl;
    //取得域名
    var domain = document.domain;
    //取得來源頁面的URL
    var referrer = document.referrer;

    document.bgColor //設置頁面背景色
    document.fgColor //設置前景色(文本顏色)
    document.linkColor //未點擊過的鏈接顏色
    document.alinkColor //激活鏈接(焦點在此鏈接上)的顏色
    document.vlinkColor //已點擊過的鏈接顏色
    document.fileCreatedDate //文件建立日期，只讀屬性
    document.fileModifiedDate //文件修改日期，只讀屬性
    document.fileSize //文件大小，只讀屬性
    document.cookie //設置和讀出cookie
    document.charset //設置字符集 簡體中文:gb2312
    
    
    document.body //指定文檔主體的開始和結束等價于body>/body>
    document.body.bgColor //設置或獲取對象后面的背景顏色
    document.body.link //未點擊過的鏈接顏色
    document.body.alink //激活鏈接(焦點在此鏈接上)的顏色
    document.body.vlink //已點擊過的鏈接顏色
    document.body.text //文本色
    document.body.innerText //設置body>.../body>之間的文本
    document.body.innerHTML //設置body>.../body>之間的HTML代碼
    document.body.topMargin //頁面上邊距
    document.body.leftMargin //頁面左邊距
    document.body.rightMargin //頁面右邊距
    document.body.bottomMargin //頁面下邊距
    document.body.background //背景圖片

Document類型提供兩個查找元素的方法:

getElementById(),如果找到相應的元素則返回該元素，如果不存在帶有相應ID的元素，則返回null。

getElementByTagName(),返回包含零或多個元素的NodeList，在HTMl文檔中，這個方法會返回一個HTMLCollection對象，與NodeList非常類似。其中THMLCollection對象有一個方法nameItem()

getElementsByName(),會返回帶有給定name特性的所有元素。

    
    var images = document.getElementsByTagName("img");
    alert(images.length);//輸出圖像的數量
    alert(images[0].src);//輸出第一個圖像元素的src特性
    alert(images.item(0).src);//輸出第一個圖像元素的src特性
    
    //根據name獲取單個相片
    var myImage = images.namedItem("myImage");
        myImage = images["myImage"];

document.write()方法可以用在兩個方面：

頁面載入過程中用實時腳本創建頁面內容

用延時腳本創建本窗口或新窗口的內容

只有當頁面被加載的時候document.write()函數才會被執行

doucment.writeln()與上述類似，區別在于換行。
open()和close()分別用于打開和關閉網頁的輸出流，如果在頁面加載期間使用write()，則不需要用這兩個方法。

Element類型用于表現XML或HTML元素，提供了對元素標簽名、子節點及特性的訪問。

所有的HTML元素都是有HTMLElement類型表示，HTMLElement類型直接繼承自ELement并添加一些屬性。添加的這些屬性分別對應于每個HTML元素中都存在的下列標準特性。

    var div = document.getElementById("myDiv");
    
    //可以獲取和設置屬性的值
    alert(div.id);
    alert(div.className);
    alert(div.title);
    alert(div.lang);
    alert(div.dir); //獲取元素的文字方向

getAttribute():用來獲取相應元素或其內容的附加信息，與上述獲取屬性基本一致，但是有兩點區別：

style，通過getAttribute()獲取的是CSS文本，通過屬性獲取的會返回一個對象。

onclick，getAttribute()獲取相應代碼的字符串，屬性獲取則會返回一個JavaScript函數。

一般情況下，開發人員最好使用對象的屬性，只要在取得自定義特征值的情況下，才會使用getAttribute()

setAttribute()：接收兩個參數，要設置的特性名和值，如果特性已經存在，會修改特性值，如果不存在則會創建。

removeAttribute():用于徹底刪除元素的特性，IE6及之前的版本不支持此方法。

document.createElement()方法可以創建新元素，此方法只接收一個參數，即要創建元素的標簽名（不區分大小）。

    //div創建插入過程 
    var div = document.createElement("div");
    div.id = "myNewDiv";
    div.className = "box";
    document.body.appendChild(div);