event事件總結(jié)

定義

event事件對(duì)象 , 當(dāng)一個(gè)事件發(fā)生的時(shí)候,和當(dāng)前這個(gè)對(duì)象發(fā)生的這個(gè)事件有關(guān)的一些詳細(xì)的信息都會(huì)被臨時(shí)保存到一個(gè)指定地方-event對(duì)象,供我們?cè)谛枰恼{(diào)用。用來(lái)獲取事件的詳細(xì)信息:鼠標(biāo)位置、鍵盤按鍵。

事件對(duì)象必須在一個(gè)事件調(diào)用的函數(shù)里面使用才有內(nèi)容

事件函數(shù):事件調(diào)用的函數(shù),一個(gè)函數(shù)是不是事件函數(shù),不在定義的決定,而是取決于這個(gè)調(diào)用的時(shí)候

兼容

ie/chrome : event是一個(gè)內(nèi)置全局對(duì)象

標(biāo)準(zhǔn)下 : 事件對(duì)象是通過(guò)事件函數(shù)的第一個(gè)參數(shù)傳入

Event對(duì)象的兼容:ev=ev||window.event

如果一個(gè)函數(shù)是被事件調(diào)用的那么,這個(gè)函數(shù)定義的第一個(gè)參數(shù)就是事件對(duì)象

屬性介紹:

button:返回一個(gè)數(shù)字,表示哪個(gè)鼠標(biāo)按鍵會(huì)按點(diǎn)擊。0:左鍵? 1:中間鍵? 2:右鍵

buttons:返回一個(gè)數(shù)字,1:左鍵? ?2:右鍵? ?4 中間鍵 (當(dāng)已有鼠標(biāo)按鍵被按下,數(shù)字會(huì)相加)

isTrusted:返回一個(gè)布爾值,true代表用戶操作觸發(fā),false表示事件由腳本生成。

bubbles:返回布爾值,指示事件是否是冒泡事件類型。

cancelable:返回布爾值,true表示事件可以被取消

cancelBubble:獲取或設(shè)置一個(gè)布爾值,true阻止冒泡事件.已廢棄

clientX:相對(duì)于瀏覽器水平距離

clientY:相對(duì)于瀏覽器垂直距離

screenX:相對(duì)于顯示屏的水平距離

screenY:相對(duì)于顯示屏的垂直距離

offsetX:相對(duì)于事件源的水平距離

offsetY:相對(duì)于事件源的水平距離

pageX:相對(duì)于網(wǎng)頁(yè)的水平距離(包括滑動(dòng)滾動(dòng)條被卷起來(lái)的部分)

pageY:相對(duì)于網(wǎng)頁(yè)的垂直距離

layerX:相對(duì)于offsetParent的水平距離(offsetParent:祖先定位元素,如果沒(méi)有就是body。定位元素指的是元素的 CSS position 屬性被設(shè)置為 relative、absolute 或 fixed 的元素。)

layerY:相對(duì)于offsetParent的垂直距離

X:event.x?是event.clientX?屬性的別名.

Y:同clientY。

target:返回事件的目標(biāo)節(jié)點(diǎn)(觸發(fā)該事件的節(jié)點(diǎn))

currentTarget:注冊(cè)事件時(shí)所指向的元素

relatedTarget:是鼠標(biāo)事件的次要目標(biāo)(如果存在)

(控制臺(tái)打印currentTarget能打印相關(guān)對(duì)象,但是打印event屬性,卻顯示null,這是因?yàn)閏urrentTarget 只能用于事件正在處理過(guò)程中,當(dāng)回調(diào)結(jié)束,會(huì)被重新賦值。)

defaultPrevented:返回一個(gè)布爾值,表示事件是否調(diào)用preventDefault()方法。

detail:返回?cái)?shù)字,點(diǎn)擊的次數(shù)

eventPhase:返回一個(gè)數(shù)字,表示事件流當(dāng)前處于哪一個(gè)階段。0:NONE沒(méi)有事件正在被處理? ?1:CAPTURING_PHASE捕獲階段.? 2:AT_TARGET目標(biāo)節(jié)點(diǎn)自身? 3:BUBBLING_PHASE起泡階段

movementX:返回一個(gè)數(shù)字,當(dāng)前事件和上一個(gè)mousemove事件之間鼠標(biāo)在水平方向上的移動(dòng)值

movementY:當(dāng)前事件和上一個(gè)mousemove事件之間鼠標(biāo)在垂直方向上的移動(dòng)值

returnValue:設(shè)置或獲取事件的返回值,非標(biāo)準(zhǔn)已廢棄

timeStamp:返回事件發(fā)生時(shí)的時(shí)間戳.

type:返回事件對(duì)象的事件類型

which:返回指定事件上哪個(gè)鍵盤鍵或鼠標(biāo)按鈕被按下。

altKey,ctrlKey,shiftKey,metaKey:表示alt,ctrl,shift,meta鍵是否被按下。


2.事件冒泡

事件冒泡 : 當(dāng)一個(gè)元素接收到事件的時(shí)候,會(huì)把他接收到的所有傳播給他的父級(jí),一直到頂層window.事件冒泡機(jī)制

–取消冒泡:ev.cancelBubble=true

事件捕獲與事件冒泡相反。


3.事件綁定

ie:obj.attachEvent(事件名稱,事件函數(shù));

1)沒(méi)有捕獲

2)事件名稱有on

3)事件函數(shù)執(zhí)行的順序:標(biāo)準(zhǔn)ie-》正序? 非標(biāo)準(zhǔn)ie-》倒序

4)this指向window

標(biāo)準(zhǔn):obj.addEventListener(事件名稱,事件函數(shù),是否捕獲);

1)有捕獲

2)事件名稱沒(méi)有on

3)事件執(zhí)行的順序是正序

4)this觸發(fā)該事件的對(duì)象

是否捕獲 : 默認(rèn)是false? ? false:冒泡 true:捕獲

是鼠標(biāo)事件的次要目標(biāo)(如果存在)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • <a name='html'>HTML</a> Doctype作用?標(biāo)準(zhǔn)模式與兼容模式各有什么區(qū)別? (1)、<...
    clark124閱讀 3,861評(píng)論 1 19
  • 轉(zhuǎn)載 前端開(kāi)發(fā)面試題 <a name='preface'>前言</a> 本文由我收集總結(jié)了一些前端面試題,初學(xué)者閱...
    小九喵喵閱讀 537評(píng)論 0 0
  • JavaScript 程序采用了異步事件驅(qū)動(dòng)編程模型。在這種程序設(shè)計(jì)風(fēng)格下,當(dāng)文檔、瀏覽器、元素或與之相關(guān)的對(duì)象發(fā)...
    劼哥stone閱讀 1,335評(píng)論 3 11
  • "new (p) T()"的用法 從p指向的空間中分配T類型的空間。如: 這樣就從p指向的空間中分配出一個(gè)char...
    王一百閱讀 330評(píng)論 0 0
  • 2016.10.26 陳珊妮的《低調(diào)人生》 與陳珊妮的交流開(kāi)始于朋友的微博推薦,我所謂的交流并非面對(duì)面的進(jìn)行,而是...
    景小跳的簡(jiǎn)單生活閱讀 323評(píng)論 0 1

友情鏈接更多精彩內(nèi)容