一、概述
事件监听中e有target和currentTarget两个属性,target只会出现在事件流目标阶段,currentTarget可能出现在事件流捕获、目标、冒泡中任一阶段。
二、区分
e.target是触发事件元素,e.currentTarget是事件监听元素,一般情况下两者指向相同,事件委托时往往e.target指向子元素而e.currentTarget指向父元素。
一般情况下:
<div id="div">
<button id="button">按钮</button>
</div>
<script>
button.addEventListener("click",function(){
console.log(e.target);//button
console.log(e.currentTarget);//button
});
</script>
事件委托时:
<div id="div">
<button id="button">按钮</button>
</div>
<script>
div.addEventListener("click",function(){
console.log(e.target);//button
console.log(e.currentTarget);//div
});
</script>
(DOM事件处理函数中this指向e.currentTarget)
JS事件:target与currentTarget区别
事件冒泡、事件捕获和事件代理
target、this、currentTarget区别
网友评论