直接上代码:

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. 【opencv】caffe 读入空图导致opencv错误

    OpenCV Error: Assertion failed (ssize.area() > ) /modules/imgproc/src/imgwarp. 根据错误提示,查看一下opencv源 ...

  2. Buy the souvenirs---hdu2126(01背包输出方案数)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2126 有n个物品每个物品的价格是v[i],现在有m元钱问最多买多少种物品,并求出有多少种选择方法: 如 ...

  3. Spring整合JUnit4进行AOP单元测试的时候,报:"C:\Program Files\Java\jdk1.8.0_191\bin\java.exe" -ea -Didea.test.cyclic.buffer.size=1048576 "-javaagent:C:\Program Files\JetBrains\IntelliJ IDEA 2018.3\lib\idea_rt.jar=64

    错误代码 "C:\Program Files\Java\jdk1.8.0_191\bin\java.exe" -ea -Didea.test.cyclic.buffer.size= ...

  4. centos 配置yum源

    1.yum配置 yum的配置文件在  /etc/yum.conf [root@mini ~]# cat /etc/yum.conf [main] cachedir=/var/cache/yum/$ba ...

  5. Html5游戏开发-145行代码完成一个RPG小Demo

    lufy前辈写过<[代码艺术]17行代码的贪吃蛇小游戏>一文,忽悠了不少求知的兄弟进去阅读,阅读量当然是相当的大.今天我不仿也搞一个这样的教程,目地不在于忽悠人,而在于帮助他人. 先看de ...

  6. index full scan和index fast full scan区别

    触发条件:只需要从索引中就可以取出所需要的结果集,此时就会走索引全扫描 Full Index Scan    按照数据的逻辑顺序读取数据块,会发生单块读事件, Fast Full Index Scan ...

  7. 编译安装MariaDB-10.0.21

    一.源码编译安装gcc-5.1.0 1.下载gcc源码包 Download (HTTP): http://ftpmirror.gnu.org/gcc/gcc-5.2.0/gcc-5.2.0.tar.b ...

  8. A simple windows programm in c

    A simple windows programm in c        The following programm is a minimal windows program. It opens ...

  9. python阳历转阴历,阴历转阳历

    #!/usr/bin/env python # coding:utf8 # author:Z time:2019/1/16 import sxtwl # 日历中文索引 ymc = [u"十一 ...

  10. Java设计原则—接口隔离原则(转)

    接口隔离原则 Interface Segregation Principle    定义: 客户端不应该依赖它不需要的接口 类间的依赖关系应该建立在最小的接口上 我们可以把这两个定义概括为一句话:建立 ...