資訊專欄INFORMATION COLUMN
摘要：事件捕獲團(tuán)隊(duì)提出的另一種事件流叫做事件捕獲。所有節(jié)點(diǎn)中都包含這兩個(gè)方法，并且它們都接受個(gè)參數(shù)要處理的事件名作為事件處理程序的函數(shù)和一個(gè)布爾值。最后這個(gè)布爾值參數(shù)如果是，表示在捕獲階段調(diào)用事件處理程序如果是，表示在冒泡階段調(diào)用事件處理程序。
JavaScript 程序采用了異步事件驅(qū)動(dòng)編程模型。在這種程序設(shè)計(jì)風(fēng)格下，當(dāng)文檔、瀏覽器、元素或與之相關(guān)的對(duì)象發(fā)生某些有趣的事情時(shí)，Web 瀏覽器就會(huì)產(chǎn)生事件（event）。例如，當(dāng) Web 瀏覽器加載完文檔、用戶把鼠標(biāo)指針移到超鏈接上或敲擊鍵盤(pán)時(shí)，Web 瀏覽器都會(huì)產(chǎn)生事件。如果 JavaScript 應(yīng)用程序關(guān)注特定類型的事件，那么它可以注冊(cè)當(dāng)這類事件發(fā)生時(shí)要調(diào)用的一個(gè)或多個(gè)函數(shù)。請(qǐng)注意，這種風(fēng)格并不只應(yīng)用于 Web 編程，所有使用圖形用戶界面的應(yīng)用程序都采用了它，它們靜待某些事情發(fā)生（即，它們等待事件發(fā)生），然后它們響應(yīng)。
請(qǐng)注意，事件本身并不是一個(gè)需要定義的技術(shù)名詞。簡(jiǎn)而言之，事件就是 Web 瀏覽器通知應(yīng)用程序發(fā)生了什么事情，這種在傳統(tǒng)軟件工程中被稱為觀察員模式。
事件流當(dāng)瀏覽器發(fā)展到第四代時(shí)（IE4 及 Netscape Communicator 4），瀏覽器開(kāi)發(fā)團(tuán)隊(duì)遇到了一個(gè)很有意思的問(wèn)題：頁(yè)面的哪一部分會(huì)擁有某個(gè)特定的事件？要明白這個(gè)問(wèn)題問(wèn)的是什么，可以想象畫(huà)在一張紙上的一組同心圓。如果你把手指放在圓心上，那么你的手指指向的不是一個(gè)圓，而是紙上的所有圓。兩家公司的瀏覽器開(kāi)發(fā)團(tuán)隊(duì)在看待瀏覽器事件方面還是一致的。如果你單擊了某個(gè)按鈕，他們都認(rèn)為單擊事件不僅僅發(fā)生在按鈕上。換句話說(shuō)，在單擊按鈕的同時(shí)，你也單擊了按鈕的容器元素，甚至也單擊了整個(gè)頁(yè)面。
事件流描述的是從頁(yè)面中接收事件的順序。但有意思的是，IE 和 Netscape 開(kāi)發(fā)團(tuán)隊(duì)居然提出了差不多是完全相反的事件流的概念。IE 的事件流是事件冒泡流，而 Netscape Communicator 的事件流是事件捕獲流。
事件冒泡IE 的事件流叫做事件冒泡（event bubbling），即事件開(kāi)始時(shí)由最具體的元素（文檔中嵌套層次最深的那個(gè)節(jié)點(diǎn)）接收，然后逐級(jí)向上傳播到較為不具體的節(jié)點(diǎn)（文檔）。以下面的HTML頁(yè)面為例：
Event Bubbling Example
Click Me
如果你單擊了頁(yè)面中的
document 也就是說(shuō)，click 事件首先在 Netscape Communicator 團(tuán)隊(duì)提出的另一種事件流叫做事件捕獲（event capturing）。事件捕獲的思想是不太具體的節(jié)點(diǎn)應(yīng)該更早接收到事件，而最具體的節(jié)點(diǎn)應(yīng)該最后接收到事件。事件捕獲的用意在于在事件到達(dá)預(yù)定目標(biāo)之前捕獲它。如果仍以前面的 HTML 頁(yè)面作為演示事件捕獲的例子，那么單擊 document
在事件捕獲過(guò)程中，document 對(duì)象首先接收到 click 事件，然后事件沿 DOM 樹(shù)依次向下，一直傳播到事件的實(shí)際目標(biāo)，即 由于老版本的瀏覽器不支持，因此很少有人使用事件捕獲。我們也建議大家放心地使用事件冒泡，在有特殊需要時(shí)再使用事件捕獲。 事件就是用戶或?yàn)g覽器自身執(zhí)行的某種動(dòng)作。諸如 click、load 和 mouseover，都是事件的名字。而響應(yīng)某個(gè)事件的函數(shù)就叫做事件處理程序（或事件偵聽(tīng)器）。事件處理程序的名字以 "on" 開(kāi)頭，因此 click 事件的事件處理程序就是 onclick，load 事件的事件處理程序就是 onload。為事件指定處理程序的方式有好幾種。 某個(gè)元素支持的每種事件，都可以使用一個(gè)與相應(yīng)事件處理程序同名的 HTML 特性來(lái)指定。這個(gè)特性的值應(yīng)該是能夠執(zhí)行的 JavaScript 代碼。例如，要在按鈕被單擊時(shí)執(zhí)行一些 JavaScript，可以像下面這樣編寫(xiě)代碼： 當(dāng)單擊這個(gè)按鈕時(shí)，就會(huì)在控制臺(tái)打印 "Clicked"。這個(gè)操作是通過(guò)指定 onclick 特性并將一些 JavaScript 代碼作為它的值來(lái)定義的。由于這個(gè)值是 JavaScript，因此不能在其中使用未經(jīng)轉(zhuǎn)義的 HTML 語(yǔ)法字符，例如和號(hào)（&）、雙引號(hào)（""）、小于號(hào)（<）或大于號(hào)（>）。為了避免使用 HTML 實(shí)體，這里使用了單引號(hào)。如果想要使用雙引號(hào)，那么就要將代碼改寫(xiě)成如下所示： 在 HTML 中定義的事件處理程序可以包含要執(zhí)行的具體動(dòng)作，也可以調(diào)用在頁(yè)面其他地方定義的腳本，如下面的例子所示： 在這個(gè)例子中，單擊按鈕就會(huì)調(diào)用 showMessage() 函數(shù)。這個(gè)函數(shù)是在一個(gè)獨(dú)立的 元素，那么這個(gè) click 事件會(huì)按照如下順序傳播：
元素上發(fā)生，而這個(gè)元素就是我們單擊的元素。然后，click 事件沿 DOM 樹(shù)向上傳播，在每一級(jí)節(jié)點(diǎn)上都會(huì)發(fā)生，直至傳播到 document 對(duì)象。下圖展示了事件冒泡的過(guò)程。
事件捕獲
元素就會(huì)以下列順序觸發(fā) click 事件。
元素。下圖展示了事件捕獲的過(guò)程。
<
閱讀需要支付1元查看