直接上代码:

body里:

   <div id="father">
father
<div id="son">
son
</div>
</div>

js:

<script type="text/javascript">
let fa = document.getElementById('father');
let son = document.getElementById('son');
fa.addEventListener('click', e => {
console.log(e.target)
console.log(e.currentTarget)
})
</script>

运行结果:

点击fa元素:

点击son元素:

结论:

target: 触发事件的对象,谁触发谁命中。

currentTarget: 绑定事件的对象,恒等于this,等于addEventListener前面的元素

 

e.target和e.currentTarget区别的更多相关文章

  1. 【小程序】获取到的e.target与e.currentTarget区别

    [小程序]获取到的e.target与e.currentTarget区别:https://blog.csdn.net/qq_33744228/article/details/80310294 使用e.t ...

  2. event.target和event.currentTarget区别

    首先本质区别是: event.target返回触发事件的元素 event.currentTarget返回绑定事件的元素

  3. 小程序--e.target和e.currentTarget区别

    事件捕获与事件冒泡 事件捕获是从外到内,事件冒泡是从内到外. 注意:不管是不是冒泡事件,都不会改变事件传递的参数值,都还是在dataset中获取(******) target:指事件源组件对象    ...

  4. 【前端】event.target 和 event.currentTarget 的区别

    event.target 和 event.currentTarget 的区别 举例说明: <!DOCTYPE html> <html> <head> <tit ...

  5. event.target 和 event.currentTarget 的区别

    event.target This property of event objects is the object the event was dispatched on. It is differe ...

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

    先上结论: Event.target:触发事件的元素: Event.currentTarget:事件绑定的元素: 通过下面的例子来理解这两个属性的区别: 使用Event.target属性的例子:(我在 ...

  7. JavaScript target与currentTarget区别

    1.DOM事件绑定到父元素 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=& ...

  8. e.target与e.currentTarget的区别

    在DOM事件对象中有两个属性总是时不时的困扰我,就是target和currentTarget,有时候很迷惑分不清两者的区别,因此有必要把这两个属性好好梳理一下,加深理解,以便日后的查询. MDN中对t ...

  9. e.target与e.currentTarget的区别,事件冒泡与事件捕获 ,事件委托

    e.target与e.currentTarget的区别:https://www.jianshu.com/p/1dd668ccc97a 事件冒泡与事件捕获 :https://www.jianshu.co ...

随机推荐

  1. 持续集成之戏说Check-in Dance(转)

    add by zhj: 先说一下持续集成的定义,这是ThoughtWorks首席科学家Martin Fowler在<持续集成>第二版中给出的,“持续集成是一种软件开发实践.在持续集成中,团 ...

  2. json中load和loads区别

    相同点 dump 和 dumps 都实现了序列化 load 和 loads 都实现反序列化 变量从内存中变成可存储或传输的过程称之为序列化序列化是将对象状态转化为可保存或可传输格式的过程. 变量内容从 ...

  3. SpringBoot-基于Maven工程使用SpringBoot

    Spring Boot SpringBoot是一个社区反馈推动的项目.SpringBoot可以说是至少五年来Spring乃至整个Java社区最有影响力的项目之一.SpringBoot主要包括以下特性: ...

  4. html读写excle文档

    import.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  5. Linux下BLAST的使用---转载

    1.把BLAST的压缩文件解压,然后将bin目录下的文件拷贝至/usr/local/bin下:2.制作软链接,将解压后的文件中bin目录链接至/home/username下,eg:ln -s /hom ...

  6. docker——三大核心概念

    镜像.容器.仓库是docker的三大核心概念. docker镜像类似于虚拟机镜像,你可以将其理解为一个只读模板. docker容器类似于一个轻量级的沙箱,Docker利用容器来运行和隔离应用.容器是从 ...

  7. C#中获取时间差

    /// <summary> /// 已重载.计算两个日期的时间间隔,返回的是时间间隔的日期差的绝对值. /// </summary> /// <param name=&q ...

  8. convention over configuration

    惯例优先原则:也称为约定大于配置或规约大于配置(convention over configuration),即通过约定代码结构或命名规范来减少配置数量,同样不会减少配置文件:即通过约定好默认规范来提 ...

  9. 使用自签名SSL证书配置HTTPS,解决浏览器提示不安全警告

    项目测试过程中需要将应用从HTTP升级到HTTPS,浏览了网上一些帖子,参考<WebLogic11g-单双向SSL配置(以Springside3为例)>一文使用openssl工具来自建CA ...

  10. timestamp类型在jsp页面输出格式化方法

    jsp页面使用了iterator迭代器,迭代器中有个属性名字为time,其类型为timestamp类型的,至于为什么是这个类型嘛,就是用navicat建好数据库直接映射出来的实体类,所以就是这个类型啦 ...