[DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event
生活随笔
收集整理的這篇文章主要介紹了
[DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
[DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event
事件
事件(Event)是用來通知代碼,一些有趣的事情發(fā)生了. 每一個(gè)Event都會(huì)被一個(gè)Event對(duì)象所表示,這個(gè)對(duì)象可能還會(huì)有一些自定義的字段或者方法,來獲取發(fā)生什么事情的更多信息. Event對(duì)象實(shí)現(xiàn)了Event接口(https://developer.mozilla.org/en-US/docs/Web/API/Event). ? 事件可以是任何事情,從最基本的用戶交互,到rendering model中自動(dòng)發(fā)生的一些事情. 有一些官方規(guī)范中的標(biāo)準(zhǔn)事件,也有一些特定瀏覽器使用的內(nèi)部事件. 各種事件可以參考:?https://developer.mozilla.org/en-US/docs/Web/Events ?事件處理器
要在某個(gè)對(duì)象發(fā)生某個(gè)事件(比如一個(gè)a標(biāo)簽被點(diǎn)擊)的時(shí)候得到通知,可以為這個(gè)對(duì)象的這個(gè)事件指定一個(gè)event handler. 指定方法: 1.用元素名為on{eventtype}的HTML屬性, 比如: <button onclick="return handleClick(event);">?
2.用JavaScript選取元素,設(shè)置對(duì)應(yīng)的onXXX屬性,比如: document.getElementById("mybutton").onclick = function(event) { ... }.?
更現(xiàn)代的瀏覽器可以用addEventListener()方法:?https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener 但是這個(gè)方法不兼容IE9之前的瀏覽器. 如果用jQuery來注冊監(jiān)聽,框架會(huì)幫我們處理瀏覽器的兼容性問題. 具體的各種注冊監(jiān)聽的方式, 上一篇博文中有總結(jié):http://www.cnblogs.com/mengdd/p/4354339.html ? Event handler可以設(shè)置在HTML元素上,也可以設(shè)置在其他產(chǎn)生事件的對(duì)象上,比如window, document, XMLHttpRequest等. 因?yàn)闅v史原因,一些<body>和<frameset>上的屬性實(shí)際是在它們的Window對(duì)象上設(shè)置event handler. 比如:onblur, onerror, onfocus, onload, onscroll. ?事件對(duì)象
在時(shí)間被觸發(fā)的時(shí)候,回調(diào)方法接收一個(gè)事件對(duì)象作為參數(shù). 這樣你在處理的時(shí)候,可以知道當(dāng)前是什么事件(type), 它的target, 以及相關(guān)的事件參數(shù). Event是一個(gè)接口, 它有一些公共的屬性和方法. 各種具體的事件接口(比如MouseEvent, KeyboardEvent)都是Event的子類. ? 事件屬性列表:?https://developer.mozilla.org/en-US/docs/Web/API/Event#Properties ? 事件對(duì)象的方法中: event.stopPropagation()?會(huì)阻止當(dāng)前事件的進(jìn)一步傳播. event.preventDefault() 會(huì)取消可以取消的事件, 但是不阻止事件的進(jìn)一步傳播. preventDefault()用來阻止一些默認(rèn)的行為發(fā)生. ? ?參考資料:
W3C Doc:?https://dvcs.w3.org/hg/dom3events/raw-file/tip/html/DOM3-Events.html 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 Event Handler:?https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers ? ?博客文章:http://chajn.org/project/javascript-events-responding-user/
轉(zhuǎn)載于:https://www.cnblogs.com/liu-Gray/p/4810186.html
總結(jié)
以上是生活随笔為你收集整理的[DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： centos 6.5 安装 redis
- 下一篇： Navicat导出表结构