event.currentTarget与event.target的差别介绍

Posted gccbuaa

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了event.currentTarget与event.target的差别介绍相关的知识,希望对你有一定的参考价值。

event.currentTarget与event.target的差别想大家在使用的时候不是非常在意。本文以測试代码来解说它门之间的不同。即,event.currentTarget指向事件所绑定的元素,而event.target始终指向事件发生时的元素。翻译的不专业,好拗口啊,还是直接上測试代码吧:  
<div id="wrapper"> 
<a href="#" id="inner">click here!</a> 
</div> 
<script type="text/javascript" src="source/jquery.js"></script> 
<script> 
$(‘#wrapper‘).click(function(e) { 
console.log(‘#wrapper‘); 
console.log(e.currentTarget); 
console.log(e.target); 
}); 
$(‘#inner‘).click(function(e) { 
console.log(‘#inner‘); 
console.log(e.currentTarget); 
console.log(e.target); 
}); 
/* 
以上測试输出例如以下: 
当点击click here!时click会向上冒泡,输出例如以下: 
#inner 
<a href=?"#" id=?"inner">?click here!?</a>? 
<a href=?"#" id=?"inner">?click here!?</a>? 
#wrapper 
<div id=?"wrapper">?…?</div>? 
<a href=?"#" id=?"inner">?click here!?</a>? 
*/ 
</script> 


以上是关于event.currentTarget与event.target的差别介绍的主要内容,如果未能解决你的问题,请参考以下文章

event.target与event.currentTarget区分

event.currentTarget

event.target和event.currentTarget的区别

如何为点击处理程序获取 HTML-5 画布的 event.target/event.currentTarget

Event对象中的target属性和currentTarget属性的区别

JavaScript事件属性event.target和currentTarget 属性的区别。