事件流(事件冒泡與事件捕獲)

2022-03-07 18:22:25 字數 642 閱讀 5417

dom結構是乙個樹形結構,當乙個html元素發生乙個事件時,該事件會在元素節點與根節點之間的路徑傳播,路徑所經過的節點都會收到該事件,這個傳播過程就是dom事件流。

分為事件冒泡模型和事件捕獲模型和dom標準事件模型

是由ie開發團隊提出來的,從dom樹形結構上理解就是事件由葉子節點沿祖先節點一直向上傳遞直至根節點。事件像水中的氣泡一樣一直往上冒,直到頂端。

1     2         子元素

3

4

與冒泡相反。由dom樹最頂層元素一直到最精確的元素。

1     2         子元素

3

4

因為兩個不同的模型都有其優點和缺點,dom標準支援捕獲型和冒泡型,是它們倆的結合體。

分為三個階段:事件捕獲階段、處於目標階段、事件冒泡階段

捕獲階段:當我們在dom樹的某個節點發生了一些操作(例如點選),就會有乙個事件發射過去,這個事件從window發出,不斷經過下級節點直到觸發的目標節點。在到達目標節點之前的過程就是捕獲階段。

目標階段:當事件不斷的傳遞直到目標節點的時候,最終在目標節點上觸發這個事件,就是目標階段

冒泡階段:事件開始時,由最具體的元素接收,然後逐級傳播到較為不具體的節點。

事件流 事件捕獲?事件冒泡?

事件流 從頁面中接收事件的順序。也就是說當乙個事件產生時,這個事件的傳播過程,就是事件流。ie中的事件流叫事件冒泡 事件冒泡 事件開始時由最具體的元素接收,然後逐級向上傳播到較為不具體的節點 文件 對於html來說,就是當乙個元素產生了乙個事件,它會把這個事件傳遞給它的父元素,父元素接收到了之後,還...

事件流 事件冒泡和事件捕獲

通俗的說就是 元素觸發時,傳播的過程。冒泡型事件流 事件的傳播是從最具體的事件目標到最不具體的事件目標。即從dom樹的葉子到根。document 捕獲型事件流 事件的傳播是從最不具體的事件目標到最具體的事件目標。即從dom樹的根到葉子。document 事件流包括三個階段 事件捕獲階段 實際目標 在...

事件捕獲與事件冒泡

事件傳播模型 事件捕獲和事件冒泡兩個過程 即事件先到達根元素,再從根元素一層一層向下傳播到目標元素,然後再一層一層向上傳到根元素。one twothree four var one document.getelementbyid one var two document.getelementbyid...