1、事件：瀏覽器客戶端上客戶觸發(fā)的行為成為時(shí)事件；所有的事件都是天生自帶的，不需要我們?nèi)ソ壎?#xff0c;只需要我們?nèi)ビ|發(fā)

當(dāng)用戶觸發(fā)一個(gè)事件時(shí)，瀏覽器的所有詳細(xì)信息都存在一個(gè)叫做event的對(duì)象上，我們把它叫做事件對(duì)象

2、獲取鼠標(biāo)的坐標(biāo)

event.clientX;event.clientY

document.οnclick=function(){

　　　　event.clientX

　　　　event.clientY

}

3、關(guān)于event的兼容性

標(biāo)準(zhǔn)：event是undefined

非標(biāo)準(zhǔn)：null

解決兼容： var e=e||windoe.event

4、事件冒泡：

當(dāng)給父子元素同一事件綁定方法的時(shí)候，觸發(fā)了子元素的事件，執(zhí)行完畢后，也會(huì)觸發(fā)父級(jí)元素的相同時(shí)間，這種傳播機(jī)制叫做事件冒泡

取消事件冒泡：event.cancelBubble=true

5、事件捕獲：

給父子元素用addEventLIstener()綁定統(tǒng)一個(gè)事件，會(huì)先觸發(fā)父元素，然后再傳遞給子元素，這種傳播機(jī)制叫做事件捕獲

（1）IE低版本沒有事件捕獲

（2）普通的事件綁定寫法沒有事件捕獲

給元素綁定事件，有兩種

（1）常用的寫法：

obj.οnclick=function(){}

這個(gè)寫法有缺點(diǎn)，如果一個(gè)元素綁定相同的事件多次，后者會(huì)覆蓋前者，因此這個(gè)寫法相當(dāng)于給obj的onclick的屬性賦值

（2）第二種寫法

標(biāo)準(zhǔn)瀏覽器用：addEventListener()

非標(biāo)準(zhǔn)用：attachEvent()

addEventListener(參數(shù)1，參數(shù)2，參數(shù)3)

參數(shù)1：事件名，并且不帶"on"

參數(shù)2：事件函數(shù)

參數(shù)3：布爾值，代表捕獲不捕獲，默認(rèn)值是false，不捕獲單冒泡

attathEvent()和addEventListener()的區(qū)別

（1）attachEvent()只用在IE8以下，addEventListener()適合標(biāo)準(zhǔn)瀏覽器

（2）attachEvent()的事件名帶on,addEventListener()的事件名不帶on

（3）attachEvent()函數(shù)里面的this是undefined，addEventListener()的函數(shù)里面的this是當(dāng)前元素對(duì)象

（4）attachEvent()只有冒泡沒有捕獲，addEventListener()有冒泡也有捕獲

call和apply

都是改變this的指向的方法，而且是函數(shù)對(duì)象、類、構(gòu)造函數(shù)?

call和apply的第一個(gè)參數(shù)是null的時(shí)候，函數(shù)里面的this還是指向原來的指向不變

所有的事件都是異步的！！！

轉(zhuǎn)載于:https://www.cnblogs.com/qinlinkun/p/10055085.html

總結(jié)

以上是生活随笔為你收集整理的JS高级：事件冒泡和事件捕获；的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。