直接上代码:

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. Error response from daemon: error creating overlay mount to /var/lib/docker/overlay2

    环境:centos7.1 docker run -t -i centos /bin/bash 运行上面的命令开启容器时报错: /usr/bin/docker-current: Error respon ...

  2. 转:docker的核心技术深度剖析

    一.docker是什么 Docker的英文本意是码头工人,也就是搬运工,这种搬运工搬运的是集装箱(Container),集装箱里面装的可不是商品货物,而是任意类型的App,Docker把App(叫Pa ...

  3. python基础之小数据池、代码块、编码

    一.代码块.if True: print(333) print(666) while 1: a = 1 b = 2 print(a+b) for i in '12324354': print(i) 虽 ...

  4. shell_02

    if判断: if [$? -eq 0];then echo "xxxxxxxxxxx" else echo "xxxxxxxxxxxxx" fi case判断: ...

  5. 前端 javascript 写代码方式

    javascript 和python一样可以用终端写代码 写Js代码: - html文件中编写 - 临时,浏览器的终端 console  

  6. oracle查看被锁的表和被锁的进程,杀掉进程

    -- 1. 查看被锁的表 SELECT p.spid, a.serial#, c.object_name, b.session_id, b.oracle_username,b.os_user_name ...

  7. 六、Mosquitto 高级应用之SSL/TLS

    mosquitto提供SSL支持加密的网络连接和身份验证.本章节讲述次功能的实现. 在此之前需要一些准备工作. 准本工作: 一台 Linux 服务器. 安装好 openssl (不会明白怎么安装 op ...

  8. cnn for qa

    最近在做QA系统,用tensorflow做了些实验,下面的的是一个cnn的评分网络.主要参考了<APPLYING DEEP LEARNING TO ANSWER SELECTION: A STU ...

  9. oracle RMAN复制数据库

    列出创建副本数据库的目的 • 选择用于复制数据库的方法 • 使用RMAN 复制数据库 • 使用RMAN 备份复制数据库 • 基于正在运行的实例复制数据库   使用副本数据库 • 使用副本数据库可执行以 ...

  10. C++关联式容器的排序准则

    stl中set和map为关联式容器,会根据排序准将元素自动排序.原型如下: template<class _Kty, class _Pr = less<_Kty>, class _A ...