[DOM Event Learning] Section 2 概念梳理 什麼是事件 DOM Event
[DOM Event Learning] Section 2 概念梳理 什麼是事件 DOM Event
事件
事件(Event)是用來通知代碼,一些有趣的事情發生了.
每個Event都會被一個Event對象所表示,這個對象可能還會有一些自定義的字段或者方法,來獲取發生什麼事情的更多信息.
Event對象實現了Event接口(https://developer.mozilla.org/en-US/docs/Web/API/Event).
事件能夠是任何事情,從最基本的用戶交互,到rendering model中自動發生的一些事情.
有一些官方規範中的標準事件,也有一些特定瀏覽器使用的內部事件.
事件處理器
要在某個對象發生某個事件(好比一個a標籤被點擊)的時候獲得通知,能夠爲這個對象的這個事件指定一個event handler.
指定方法:
1.用元素名爲on{eventtype}的HTML屬性, 好比:
<button onclick="return handleClick(event);">
2.用JavaScript選取元素,設置對應的onXXX屬性,好比:
document.getElementById("mybutton").onclick = function(event) { ... }.
更現代的瀏覽器能夠用addEventListener()方法: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
可是這個方法不兼容IE9以前的瀏覽器.
若是用jQuery來註冊監聽,框架會幫咱們處理瀏覽器的兼容性問題.
具體的各類註冊監聽的方式, 上一篇博文中有總結:http://www.cnblogs.com/mengdd/p/4354339.html
Event handler能夠設置在HTML元素上,也能夠設置在其餘產生事件的對象上,好比window, document, XMLHttpRequest等.
由於歷史緣由,一些<body>和<frameset>上的屬性實際是在它們的Window對象上設置event handler.
好比:onblur, onerror, onfocus, onload, onscroll.
事件對象
在時間被觸發的時候,回調方法接收一個事件對象做爲參數.
這樣你在處理的時候,能夠知道當前是什麼事件(type), 它的target, 以及相關的事件參數.
Event是一個接口, 它有一些公共的屬性和方法.
各類具體的事件接口(好比MouseEvent, KeyboardEvent)都是Event的子類.
事件對象的方法中:
event.stopPropagation() 會阻止當前事件的進一步傳播.
event.preventDefault() 會取消能夠取消的事件, 可是不阻止事件的進一步傳播.
preventDefault()用來阻止一些默認的行爲發生.
參考資料:
Event Developer Guide: https://developer.mozilla.org/en-US/docs/Web/Guide/Events
learn jQuery Events: http://learn.jquery.com/events/
Mozilla Event reference: https://developer.mozilla.org/en-US/docs/Web/Events
博客文章:http://chajn.org/project/javascript-events-responding-user/javascript
相關文章
- 1. [DOM Event Learning] Section 4 事件分發和DOM事件流
- 2. event、Dom
- 3. [DOM Event Learning] Section 3 jQuery事件處理基礎 on(), off()和one()方法使用
- 4. DOM Event與this
- 5. HTML DOM Event
- 6. DOM事件的event和IE事件的event的區別
- 7. HTML DOM Event 對象
- 8. 什麼是 Event Loop？
- 9. 什麼是Event Loop
- 10. DOM是什麼？
- 更多相關文章...
- • C# 事件（Event） - C#教程
- • CAP理論是什麼？ - NoSQL教程
- • Docker 清理命令
- • Java Agent入門實戰（二）-Instrumentation源碼概述
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
