JavaScript 事件冒泡和捕獲模式

binaryTree 發布于2019-08-26 13:41 / 2551人閱讀

摘要：捕獲模式，的第三個參數為則為捕獲模式，點擊時事件觸發順序為冒泡模式，不填寫的第三個參數為冒泡模式，點擊時事件觸發順序為取消冒泡取消冒泡，取消冒泡后事件就不會往上層傳遞，這時只有監聽的事件被執行冒泡和捕獲的執行順序如果同時使用冒

捕獲模式

1，addEventListener 的第三個參數 useCapture 為 true 則為捕獲模式
2，點擊 C 時事件觸發順序為 A -> B -> C

冒泡模式

1，不填寫 addEventListener 的第三個參數為冒泡模式
2，點擊 C 時事件觸發順序為 C -> B -> A

取消冒泡

// 取消冒泡
event.cancelBubble = true

1，取消冒泡后事件就不會往上層傳遞
2，這時只有監聽 C 的事件被執行

冒泡和捕獲的執行順序

如果同時使用冒泡和捕獲，先監聽誰就先執行誰

云服務器 GPU云服務器冒泡事件事件冒泡事件冒泡機制阻止冒泡事件

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/109330.html

javascript 之事件篇

摘要：處于目標階段事件在上發生并處理。冒泡階段事件又傳播回文檔。不支持捕獲事件的。總結二使用事件委托新添加的元素還會有之前的事件。事件對象在觸發某個事件時，會產生一個事件對象。 js 是采用異步事件驅動的機制來響應用戶操作的，也就是說當用戶對某個html元素進行操作的時候，會產生一個事件，該事件會驅動某些函數來處理。事件源：產生事件的地方（html元素，窗口，其他等等)；事件：鼠標事件，鍵盤...

Forest10 2019-08-21 16:17 評論0 收藏0
白話解釋 Javascript事件preventDefault,stopPropagation及re

摘要：如圖使用事件捕獲模式注冊事件監聽對最外層，中間層，最內層分別用捕獲模式注冊事件監聽，我們上面說了，如果使用捕獲模式，那么第三個參數應該是，否則則是冒泡模式，如果不聲明，默認為冒泡模式。來源: 個人博客想必好多童鞋都有直接復制粘貼event.preventDefault() 或者event.stopPropagation() 的經歷，但是為什么這樣做不甚了解，今天我們的目的就是要徹...

chanjarster 2019-08-21 15:09 評論0 收藏0
理解DOM事件流的三個階段

摘要：本文主要解決兩個問題什么是事件流事件流的三個階段起因在學習前端的大半年來，對事件了解甚少。事件流所描述的就是從頁面中接受事件的順序。事件流事件流包括三個階段。防止事件冒泡而帶來不必要的錯誤和困擾。分有事件冒泡與事件捕獲兩種。本文主要解決兩個問題：什么是事件流 DOM事件流的三個階段起因在學習前端的大半年來，對DOM事件了解甚少。一般也只是用用onclick來綁定個點擊事件。...

xiangzhihong 2019-08-19 17:38 評論0 收藏0
理解DOM事件流的三個階段

摘要：本文主要解決兩個問題什么是事件流事件流的三個階段起因在學習前端的大半年來，對事件了解甚少。事件流所描述的就是從頁面中接受事件的順序。事件流事件流包括三個階段。防止事件冒泡而帶來不必要的錯誤和困擾。分有事件冒泡與事件捕獲兩種。本文主要解決兩個問題：什么是事件流 DOM事件流的三個階段起因在學習前端的大半年來，對DOM事件了解甚少。一般也只是用用onclick來綁定個點擊事件。...

afishhhhh 2019-08-01 15:04 評論0 收藏0