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

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

DOM將HTML和XML文檔描繪成一個有多個節(jié)點構(gòu)成的結(jié)構(gòu)，節(jié)點分為12種不同的節(jié)點類型，每種都擁有自己的特點、數(shù)據(jù)和方法，并且和其他節(jié)點存在著某種關(guān)系。

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

DOM1級定義了Node接口，該接口由DOM中的所有節(jié)點類型實現(xiàn)。這個接口在JavaScript中是作為Node類型實現(xiàn)的。因此JavaScript中所有的節(jié)點類型都繼承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沒有公開構(gòu)造函數(shù)，因此上述代碼不能在IE中使用。所以為了確保跨瀏覽器的兼容性，判斷Node類型的方法如下：

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

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

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

文檔中所有節(jié)點相互之間都有關(guān)系，包括父子關(guān)系，同胞關(guān)系。

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

parentNode：指向文檔樹種的父節(jié)點

nextSibling：緊挨著當前節(jié)點的下一個節(jié)點

previousSibling：緊挨著當前節(jié)點的上一個節(jié)點

firstChild：表現(xiàn)某一節(jié)點的第一個節(jié)點，childNodes[0]

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

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

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

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

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

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

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

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

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

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

childNodes，直接訪問文檔元素。

document.body，直接指向body元素

doucment.doctype，取得標簽的信息

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

document對象有一些標準的Document對象所沒有的屬性，提供了 document對象所表現(xiàn)的網(wǎng)頁的一些信息。

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

    document.bgColor //設(shè)置頁面背景色
    document.fgColor //設(shè)置前景色(文本顏色)
    document.linkColor //未點擊過的鏈接顏色
    document.alinkColor //激活鏈接(焦點在此鏈接上)的顏色
    document.vlinkColor //已點擊過的鏈接顏色
    document.fileCreatedDate //文件建立日期，只讀屬性
    document.fileModifiedDate //文件修改日期，只讀屬性
    document.fileSize //文件大小，只讀屬性
    document.cookie //設(shè)置和讀出cookie
    document.charset //設(shè)置字符集 簡體中文:gb2312
    
    
    document.body //指定文檔主體的開始和結(jié)束等價于body>/body>
    document.body.bgColor //設(shè)置或獲取對象后面的背景顏色
    document.body.link //未點擊過的鏈接顏色
    document.body.alink //激活鏈接(焦點在此鏈接上)的顏色
    document.body.vlink //已點擊過的鏈接顏色
    document.body.text //文本色
    document.body.innerText //設(shè)置body>.../body>之間的文本
    document.body.innerHTML //設(shè)置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);//輸出圖像的數(shù)量
    alert(images[0].src);//輸出第一個圖像元素的src特性
    alert(images.item(0).src);//輸出第一個圖像元素的src特性
    
    //根據(jù)name獲取單個相片
    var myImage = images.namedItem("myImage");
        myImage = images["myImage"];

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

頁面載入過程中用實時腳本創(chuàng)建頁面內(nèi)容

用延時腳本創(chuàng)建本窗口或新窗口的內(nèi)容

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

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

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

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

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

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

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

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

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

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

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

document.createElement()方法可以創(chuàng)建新元素，此方法只接收一個參數(shù)，即要創(chuàng)建元素的標簽名（不區(qū)分大?。?/p>

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