“约见”面试官系列之常见面试题之第六十一篇之IE和DOM事件流（建议收藏）
什么是“事件流”？
事件流描述的是從頁面中接收事件的順序
事件流的種類：
事件流主要分為三種
- 事件冒泡流(IE事件流)：事件開始時由最具體的元素(文檔中嵌套最深的那個節點)接收，然后逐級向上傳播到較為不具體的節點(文檔)
- 事件捕獲流(Netscape事件流)：不太具體的節點最先接收到事件，而最具體的節點應該最后接收到事件(在事件到達預定目標之前捕獲到)
- DOM事件流：事件流包括三個階段，事件捕獲階段，處于目標階段，事件冒泡階段。首先發生的是事件捕獲，為截獲事件提供了機會；然后是實際的目標接收事件；最后是冒泡階段，可以在這個階段對事件做出響應。
IE和DOM事件流的區別：
IE和DOM事件流的區別主要有四個方面不一樣
- 執行的順序不一樣：事件俺的執行順序不一樣
????? 案例為：
<body><div><button id = 'btn'>點擊<button></div></body>三種事件流分別是：
冒泡型事件模型(IE事件流)： button->div->body
捕獲型事件模型(Netscape事件流)： body->div->button
DOM事件模型： body->div->button->button->div->body (先捕獲后冒泡)
- IE和DOM事件偵聽函數的區別：
?
- 事件參數不一樣和this指向不一樣
???????如上的兩個不一樣的事件偵聽函數：
????? attachEvent接受兩個參數，第一個參數是事件名稱，第二個fnHandler是回調處理函數
?????????? 注意：IE下利用attachEvent注冊的處理函數調用時this指向不再是先前注冊事件的元素，這時的this為window對象了
?????? addEventListener方法接受三個參數：
?????????? 第一個參數是事件名稱，值得注意的是，這里事件名稱與IE的不同，事件名稱是沒’on’開頭的;
???????????第二個參數fnHandler是回調處理函數;
?????????? 第三個參數注明該處理回調函數是在事件傳遞過程中的捕獲階段被調用還是冒泡階段被調用
???????????注意：它可以在一個DOM元素上綁定多個事件處理器，并且在處理函數內部，this關鍵字仍然指向被綁定的DOM元素，另外處理函數參數列表的第一個位置傳遞事件event對象
本面試題為前端常考面試題，后續有機會繼續完善。我是歌謠，一個沉迷于故事的講述者。
歡迎一起私信交流。
“睡服“面試官系列之各系列目錄匯總（建議學習收藏）?
總結
以上是生活随笔為你收集整理的“约见”面试官系列之常见面试题之第六十一篇之IE和DOM事件流（建议收藏）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 【书】Head First设计模式(中文
- 下一篇： 材料成形计算机辅助设计,材料成形及控制工