生活随笔
收集整理的這篇文章主要介紹了
2020-4-2
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
題目一
利用事件冒泡原理實(shí)現(xiàn)了獲取td單元格內(nèi)容的功能。
<!DOCTYPE html
>
<html
>
<head
>
<meta charset
=" utf-8">
<style type
="text/css">
#table
{ width
:300px
; height
:100px
; border
:1px solid #ccc
; border
-collapse
:collapse
;
}
#table td
,.table th
{ border
:1px solid #ccc
; padding
:5px
;
}
</style
>
<script
>
window
.onload=function(){let otable
=document
.getElementById("table");let oshow
=document
.getElementById("show");otable
.onclick=function(ev
){let target
=ev
.target
;oshow
.innerHTML
=target
.innerHTML
;}
}
</script
>
</head
>
<body
>
<div id
="show"></div
>
<table id
="table"> <thead
> <tr
> <th
>例一
</th
> <th
>例二
</th
> </tr
> </thead
> <tr
> <td
>例三
</td
> <td
>例四
</td
> </tr
> <tr
> <td
>例五
</td
> <td
>例六
</td
> </tr
>
</table
>
</body
>
</html
>
運(yùn)行結(jié)果：
相關(guān)知識(shí)：
target屬性可以返回觸發(fā)事件的元素。
事件冒泡參閱Java script事件冒泡
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)
總結(jié)
以上是生活随笔為你收集整理的2020-4-2的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。
