代码描述:js事件源对象。js获取事件源对象代码实例
所谓的事件源对象就是事件触发的对象,比如我们点击一个按钮,那么这个按钮就是事件源对象,但是有时候我们可能利用事件冒泡原理将事件处理函数注册在父级元素上,无论点击哪个子元素都会执行事件处理函数,有时候我们想要明确的知道是哪个对象触发的事件,下面就通过代码实例介绍一下如何实现此效果,代码如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="https://www.51qianduan.com/" /> <title>51前端</title> <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 type="text/javascript"> window.onload=function(){ var otable=document.getElementById("tb"); var oshow=document.getElementById("show"); otable.onclick=function(ev){ var ev= ev||window.event; var target=ev.target||ev.srcElement; oshow.innerHTML=target.innerHTML; } } </script> </head> <body> <div id="show"></div> <table class="table" id="tb"> <thead> <tr> <th>51前端一</th> <th>51前端二</th> </tr> </thead> <tr> <td>javascript教程</td> <td>jQuery教程</td> </tr> <tr> <td>HTML教程</td> <td>div css教程</td> </tr> </table> </body> </html>
请绑定手机号,在继续操作
注意:只有绑定手机以后,才可使用网站全部功能