e.currentTarget与e.target
程序员文章站
2023-02-15 20:50:51
e.currentTarget指的是注册了事件监听器的对象，而e.target指的是该对象里的子对象 html中
e.currentTarget指的是注册了事件监听器的对象，而e.target指的是该对象里的子对象
html中
<div id="addBtn" v-on:click="checksBtn($event)" class="everyMes curs checkeds" title="查询">
<Icon class="iconCommon" style="color:#80848f;" type="search"></Icon><span>查询</span> <span class="triangle"></span><Icon class="imgIcon" type="checkmark-round"></Icon>
</div>
css代码：
.checkeds{
border:1px solid #2d8cf0 !important;
}
js代码：
当用e.currentTarget时
methods: {
checksBtn:function(e){
e.currentTarget.classList.toggle("checkeds");
}
}
效果：
当点击查询这两个字时 作用在整个最大的id="addBtn" div上
当用e.target时
methods: {
checksBtn:function(e){
e.target.classList.toggle("checkeds");
}
}
效果：
当点击查询这两个字时 作用在子元素 span上，不会作用在最大的作用在整个最大的id="addBtn" 上
总结：结合事件捕获和事件冒泡，e.currentTarget指的是注册了事件监听器的对象，而e.target指的是该对象里的子对象
上一篇： JS事件委托