Event 物件
阿新 • • 發佈:2018-11-15
1. 事件物件
Event 物件代表事件的狀態,比如事件在其中發生的元素、鍵盤按鍵的狀態、滑鼠的位置、滑鼠按鈕的狀態。
- 什麼時候會產生Event 物件呢?
- 例如: 當用戶單擊某個元素的時候,我們給這個元素註冊的事件就會觸發,該事件的本質就是一個函式,而該函式的形參接收一個event物件.
- 事件通常與函式結合使用,函式不會在事件發生前被執行!
target 事件屬性可返回事件的目標節點(觸發該事件的節點),如生成事件的元素、文件或視窗。
語法
event.target
2. 事件流
2.1 事件流發展史
- 事件發展史,這位大神已經寫好了,想去偷瞄兩眼的請點選這裡
2.2 冒泡
- 什麼是事件冒泡,
- 官方的定義就是從最特定的事件目標到最不特定的事件目標
意思就是說,假如使用者單擊了一個元素,該元素擁有一個click事件,那麼同樣的事件也將會被它的祖先觸發,這個事件從該元素開始一直冒泡到DOM樹的最上層,這一過程稱為事件冒泡
2.3 捕獲
- 什麼是事件捕獲
事件捕獲和事件是相反的,也就是說,當用戶觸發了一個事件的時候,這個事件是從DOM樹的最上層開始觸發一直到捕獲到事件源.
2.4 事件流
- 它的由來
由於微軟和網景亂搞,後來必須要為事件傳播機制,制定一個標準,因為事件捕獲是網景公司開發出來的,而事件冒泡是由微軟公司開發出來的,它們都想要自己的技術成為標準,所以導致這兩個公司老是幹架,制定標準的人為了不讓它們幹架,所以研發了事件流.
2.5 事件流的寫法以及實現方式
- 標準實現方式使用關鍵詞
addEventListener
element.addEventListener(eventType, fn, false)
dom物件.addEventListener(事件型別, 回撥函式, 事件機制)
這裡的事件型別表示你要使用哪種事件型別比如click
, 回撥函式裡面寫著觸發此事件你要做什麼事情, 事件機制分為冒泡和捕獲,如果為false
表示事件冒泡,為true
表示事件捕獲
- 既然有標準的實現方式,那麼肯定也存在著不和諧的寫法,沒辦法誰讓人家牛逼呢,俗話說的好啊
兩虎之爭必有一傷
,可傷了我們程式設計師了.這種不和諧的寫法是
dom物件.attachEvent(eventType, fn)
第一個引數表示事件型別,第二個是回撥.這種寫法相容IE, IE沒有實現事件捕獲,因為在當時他比較厲害,以為沒必要…………只是,,,,省略一千字, 現在微軟的瀏覽器已經做得很好了… 只是調侃一下無其他意圖..
- 以上的兩種寫法一種是相容W3C標準的一種是老版IE的寫法