JavaScript 文檔對象模型

2018-09-28 18:06 更新

文檔對象模型

在瀏覽器窗口中的每個(gè)網(wǎng)頁都可以看作一個(gè)對象。

文檔對象就代表了在瀏覽器窗口中顯示的那個(gè) HTML 文檔。文檔對象有很多屬性表示其他的一些對象,通過對這些屬性的操作,我們就可以訪問或者修改文檔的內(nèi)容。

對文檔對象的訪問和修改的方式被稱為文檔對象模型,或者稱為DOM。這些對象是按照繼承關(guān)系組織在一起的。這個(gè)繼承關(guān)系結(jié)構(gòu)用來將網(wǎng)頁文檔對象聯(lián)系在一起。

  • 窗口對象: 繼承關(guān)系中的最頂層。它是繼承結(jié)構(gòu)中對頂層的元素。
  • 文檔對象: 每一個(gè)被加載到窗口中的 HTML 對象變成了文檔對象。文檔對象中包含了網(wǎng)頁的內(nèi)容。
  • 表單對象: 任何以 <form>...</form> 標(biāo)簽圈起來的內(nèi)容是表單對象。
  • 表單控制元素: 這個(gè)表單對象包含表單中定義的所有元素,例如文本框,按鈕,單選按鈕和多選按鈕。

如下是一些重要對象的繼承結(jié)構(gòu)圖:

有幾個(gè)文檔對象是已經(jīng)實(shí)現(xiàn)了的。下面的部分詳細(xì)的介紹這些文檔對象,并且介紹你如何利用這些對象訪問和修改文檔內(nèi)容。

  • 傳統(tǒng)的文檔對象模型: 這個(gè)模型是在 JavaScript 語言早期版本中引入的。它能夠很好的被所有的瀏覽器支持,但是僅僅只被允許訪問文檔某些確定的關(guān)鍵區(qū)域,比如,表單,表單元素和圖像。
  • W3C 文檔對象模型: 這種文檔對象模型允許訪問和修改所有的文檔內(nèi)容,而且它是被萬維網(wǎng)組織標(biāo)準(zhǔn)化的。這種模型基本上被所有的現(xiàn)代瀏覽器支持。
  • IE4 文檔對象模型: 這種文檔對象模型是由微軟的 IE 瀏覽器的第四版本而引入的。IE 5和之后的瀏覽器版本能夠支持 W3C 文檔對象模型的大多數(shù)特性。

文檔對象的兼容性

如果你想寫個(gè)腳本,當(dāng) W3C 文檔對象模型可用的時(shí)候,利用這種模型,而當(dāng) IE 4文檔對象模型有效的時(shí)候,利用 IE 4文檔對象模型,因此,你可以利用兼容性測試的方法,這種方法首先檢測已經(jīng)存在的方法或者屬性,從而去決定瀏覽器是否能夠兼容你想要的文檔對象模型。例如:

    if (document.getElementById) {

         // If the W3C method exists, use it

    }

    else if (document.all) {

        // If the all[] array exists, use it

    }

    else {

        // Otherwise use the legacy DOM

    }
以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)