你好JS：[3]捕獲和冒泡事件模型?

以前學JS的時候對捕獲和冒泡事件一直都覺得難於理解，也找過很多資料，但那些大多都是讓人看不明白的。現在我就用一種比較直觀的方法描述捕獲和冒泡事件模型。

工具/原料

JavaScript

理論

捕獲事件就像你折開一個層層包裹的禮物盒，折開一層沒有看到就繼續折，直到折到為止

冒泡事件剛好和捕獲事件相反

例子

這裡就通過一個例子讓你更直觀地瞭解冒泡事件和捕獲事件，完整代碼如下：

事件監聽器以冒泡的方式註冊（false即是開啟了冒泡方式，注意例子中的addEventListener不兼容IE）

運行代碼，會發現最先彈出“b”，說明最先觸發了最底層的B元素：

點擊確定，會彈出"a",說明繼B元素之後，觸發了A元素

如此可以看出冒泡事件即是從事件所能觸發的最底層元素開始的，然後往上逐層觸發事件。

捕獲事件則好和它相反。

注意事項

如果有用就投一票吧