target是指获取事件的目标
currentTarget是指其事件处理程序当前正在处理事件的那个元素
在事件处理程序内部,对象this始终等于currentTarget的值。
在什么情况下target和currentTarget相等
当事件处理程序直接绑定在目标元素上,此时e.target===e.currentTarget,e.target ===this
不相等的时候
当事件处理程序绑定在目标元素的父节点上时,currentTarget会指向绑定的父元素,而target依旧指向目标元素apple
<body>
<ul id="box">
<Li id="apple">苹果</Li>
<li>香蕉</li>
<li>桃子</li>
</ul>
</body>
<script type="text/javascript">
var box = document.getElementById(‘box‘);
var apple = document.getElementById(‘apple‘);
//直接绑定在目标元素apple上
apple.onclick = function (e){
console.log(e.target); //<li id="apple">苹果</li>
console.log(e.currentTarget); //<li id="apple">苹果</li>
console.log(this); //<li id="apple">苹果</li>
console.log(e.target === e.currentTarget); //true
console.log(e.target === this); //true
}
//绑定在apple的父元素box上
box.onclick = function (e){
console.log(e.target); // <li id="apple">苹果</li>
console.log(e.currentTarget); //<ul id="box">...</ul>
console.log(this); //<ul id="box">...</ul>
console.log(e.currentTarget===this); //true
console.log(e.target === e.currentTarget); //false
console.log(e.target === this); //false
}
</script>
原文:https://www.cnblogs.com/laoli-boke/p/13623836.html