js中事件對象和事件委托的介紹

Ie9以下瀏覽器中的事件對象是放在全局中的window.event;
解決兼容性:event = event || window.event
事件委托(就是將事件綁定到父級/爺爺級對象上,通過事件對象的target屬性來控制子級對象的改變):
event.target(點(diǎn)擊的目標(biāo)對象)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
td{
width: 100px;
height: 100px;
border:2px solid red;
}
</style>
</head>
<body>
<table >
<tr>
<td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
<tr>
<td></td><td></td><td></td>
</tr>
</table>
</body>
<script>
var tab = document.getElementsByTagName("table")[0];
tab.onclick = function (event) {
//點(diǎn)擊子級對象改變顏色
event.target.style.backgroundColor = "black";
}
</script>
</html>
若有不足請多多指教!希望給您帶來幫助!
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對腳本之家的支持。如果你想了解更多相關(guān)內(nèi)容請查看下面相關(guān)鏈接
相關(guān)文章
javascript實(shí)現(xiàn)復(fù)選框選中屬性
本文給大家介紹的是一篇國外網(wǎng)友寫的博客,講解的是關(guān)于實(shí)現(xiàn)復(fù)選框選中屬性的問題,感覺非常不錯,翻譯過來推薦給大家,希望小伙伴們能夠喜歡。2015-03-03
使用 Jest 和 Supertest 進(jìn)行接口端點(diǎn)測試實(shí)例詳解
這篇文章主要介紹了使用 Jest 和 Supertest 進(jìn)行接口端點(diǎn)測試,結(jié)合實(shí)例形式詳細(xì)分析了使用 Jest 和 Supertest 進(jìn)行接口端點(diǎn)測試具體原理、操作技巧與相關(guān)注意事項(xiàng),需要的朋友可以參考下2020-04-04
js實(shí)現(xiàn)iframe自動自適應(yīng)高度的方法
這篇文章主要介紹了js實(shí)現(xiàn)iframe自動自適應(yīng)高度的方法,涉及javascript操作iframe框架的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-02-02
JavaScript高級程序設(shè)計(jì) 閱讀筆記(十四) js繼承機(jī)制的實(shí)現(xiàn)
繼承是面向?qū)ο笳Z言的必備特征,即一個類能夠重用另一個類的方法和屬性。在JavaScript中繼承方式的實(shí)現(xiàn)方式主要有以下五種:對象冒充、call()、apply()、原型鏈、混合方式2012-08-08

