Javascript事件階段:在添加事件監聽時冒泡與捕獲階段的不同


Q:描述下js里面的事件流

A:DOM2級事件模型中規定了事件流的三個階段:捕獲階段、目標階段、冒泡階段,低版本IE(IE8及以下版本)不支持捕獲階段

捕獲事件流:Netscape提出的事件流,即事件由頁面元素接收,逐級向下,傳播到最具體的元素。

冒泡事件流:IE提出的事件流,即事件由最具體的元素接收,逐級向上,傳播到頁面。

 

定義和用法:

addEventListener() 方法用於向指定元素添加事件句柄。

使用removeEventListener() 方法來移除addEventListener()方法添加的事件句柄。

語法:

element.addEventListener(event,function,useCapture)

參數值:

event:必須。字符串,指定事件名。

注意: 不要使用 "on" 前綴。 例如,使用 "click" ,而不是使用 "onclick"。 

function:必須。指定要事件觸發時執行的函數。 

當事件對象會作為第一個參數傳入函數。 事件對象的類型取決於特定的事件。例如, "click" 事件屬於 MouseEvent(鼠標事件) 對象。

useCapture:

可選。布爾值,指定事件是否在捕獲或冒泡階段執行。

可能值:

    • true - 事件句柄在捕獲階段執行
    • false- false- 默認。事件句柄在冒泡階段執行

 

 

 分別在window、document、html、body、btn上綁定事件,單擊按鈕,輸出結果如下:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM