明輝手游網(wǎng)中心：是一個免費提供流行視頻軟件教程、在線學習分享的學習平臺！

DHTML對象模型（About the DHTML Object Model）(一)

發(fā)表時間：2024-06-01 來源：明輝站整理相關(guān)軟件相關(guān)文章人氣：

[摘要]【注：最近在學習asp.net，覺得javascript的很多知識在asp.net中仍很有用，又覺得javascript的實質(zhì)是利用腳本對DHTML對象編程，但網(wǎng)上關(guān)于DHTML層次結(jié)構(gòu)的中文資料又比較少，所以看了msdn上的這個資料后就翻譯了出來，希望大家多多指教。】 DHTML對象模型（Abo...

【注：最近在學習asp.net，覺得javascript的很多知識在asp.net中仍很有用，又覺得javascript的實質(zhì)是利用腳本對DHTML對象編程，但網(wǎng)上關(guān)于DHTML層次結(jié)構(gòu)的中文資料又比較少，所以看了msdn上的這個資料后就翻譯了出來，希望大家多多指教�！�
DHTML對象模型（About the DHTML Object Model）


動態(tài)HTML(DHTML)文檔對象模型（Document Object Model :DOM）使網(wǎng)頁制作者可以直接地以可編程的方式訪問Web文檔上每個獨立的部分，而不論被訪問的是元素還是容器。這種訪問方式包括了事件模型，事件模型令瀏覽器可對用戶輸入做出反應(yīng)，通過執(zhí)行腳本，無須從服務(wù)器下載一個新的頁面就可以根據(jù)用戶輸入顯示新的內(nèi)容。動態(tài)HTML文檔對象模型(DHTML DOM)以一種便捷的方式為廣大普通網(wǎng)頁制作者提供了豐富的網(wǎng)頁交互性。



· 什么是對象模型？（What Is the Object Model?）

· 使用腳本訪問元素（Accessing Elements with Script）

· 事件：冒泡，禁止與處理（Events: Bubbling, Canceling, and Handling）

· 處理鼠標效果（Handling Rollover Effects）

· 禁止事件（Canceling Events）

· 進一步的思考（Special Considerations）

· 相關(guān)主題（Related Topics）



什么是對象模型？
對象模型就是令DHTML可編程的結(jié)構(gòu)，它不需要網(wǎng)頁制作者學習任何新的HTML標記，它也不涉及任何新的網(wǎng)頁制作技術(shù)。事實上，事實上這個對象模型是建基于網(wǎng)頁制作者過去已經(jīng)習慣的網(wǎng)頁制作技術(shù)的�；貞浺幌履阌蟹駠L試過使用腳本來為表單（form）元素設(shè)置值，又或者使用腳本來為一個微軟IE3.0瀏覽器中的鏈接添加一個mouseover事件；如果有，那么你已經(jīng)在通過腳本使用DHTML對象模型的一個有限形式來訪問你的HTML網(wǎng)頁了。

現(xiàn)在這個DHTML對象模型的唯一不同是：現(xiàn)在，任何一個HTML元素都是可編程的。這意味著頁面上的任何一個HTML元素都可以擁有相應(yīng)的腳本，可以使用這些腳本代碼來使頁面與用戶的動作發(fā)生交互，動態(tài)地改變頁面內(nèi)容。這種事件模型使文檔(document)可以在用戶對頁面做出某種動作（例如，當用戶把鼠標指針移動到一個特定的元素上，或者按下了鍵盤按鍵，又或者在表單中輸入了新的信息）后，做出相應(yīng)的反應(yīng)。每一個事件都可以被鏈接到一段腳本以告訴瀏覽器如何在這次交互中變更內(nèi)容，而無需返回服務(wù)器去獲取一個新的文件。這帶來的好處是，網(wǎng)頁制作者可以用更少的頁面制作出富交互性的代碼。而網(wǎng)頁的瀏覽者因為無需等待新的頁面從網(wǎng)站下載到客戶端，無論從瀏覽速度到瀏覽效果都得到了全面的提升。

使用腳本訪問元素
在對象模型中每一個HTML元素都是一個可編寫腳本的對象，擁有自己的一組屬性(properties)、方法（Methods）和事件（Events）。要為元素對象編寫腳本，網(wǎng)頁制作者首先必須知道如何獲取一個對象。

DHTML的焦點是元素的集合（collection），以及這些元素如何被組織進一個層次結(jié)構(gòu)中。這些元素集合中最重要的就是all集合(all collection)和children集合(children collection)。一個DHTML文檔就是一組結(jié)構(gòu)化地排列的元素在下面的例子里每個元素都有其各自的影響范圍，這個范圍取決于這個標記在文檔中出現(xiàn)的位置。

<HTML>
<BODY>
<DIV>
<P>Some text in a
<B>paragraph</B>
</P>
<IMG id=image1 src="http://www.okasp.com/techinfo/mygif.gif">
</DIV>
<IMG id=image2 src="http://www.okasp.com/techinfo/mygif.gif">
</BODY>
</HTML>
在上面的例子中div對象包含了一個p對象和一個叫image1的img對象，同時也是這兩個對象的父級（parent），相對地p對象和img對象是div對象的孩子(children)。而叫image2的img對象，則是body對象的孩子。

每一個元素對象都有一個叫做all的對象集合和一個叫children的對象集合，all的對象集包含了在這個元素層次結(jié)構(gòu)下的所有對象，而children對象集合則包含了當前元素的所有直接子代元素。在上面的例子中，b在div對象的all集合中，但不會出現(xiàn)在div對象的children集合中；同樣地，div對象是body對象all集合中的一個成員，而p對象則不是。

每一個元素除了擁有上面所說的集合外，文檔（由document對象表示）本身還擁有一系列元素和非元素集合,其中最重要的一個集合就是all集合，它包含了在當前web頁面上的所有元素，這個集合是腳本語言訪問元素對象的最基本途徑。有關(guān)使用元素對象集合的更多信息，請參閱“對元素和集合編寫腳本”（Scripting with Elements and Collections）