event.currentTarget与event.target的差别想大家在使用的时候不是非常在意。本文以測试代码来解说它门之间的不同。即,event.currentTarget指向事件所绑定的元素,而event.target始终指向事件发生时的元素。翻译的不专业,好拗口啊,还是直接上測试代码吧:  
<div id="wrapper">
<a href="#" id="inner">click here!</a>
</div>
<script type="text/javascript" src="source/jquery.js"></script>
<script>
$('#wrapper').click(function(e) {
console.log('#wrapper');
console.log(e.currentTarget);
console.log(e.target);
});
$('#inner').click(function(e) {
console.log('#inner');
console.log(e.currentTarget);
console.log(e.target);
});
/*
以上測试输出例如以下:
当点击click here!时click会向上冒泡,输出例如以下:
#inner
<a href=​"#" id=​"inner">​click here!​</a>​
<a href=​"#" id=​"inner">​click here!​</a>​
#wrapper
<div id=​"wrapper">​…​</div>​
<a href=​"#" id=​"inner">​click here!​</a>​
*/
</script>

event.currentTarget与event.target的差别介绍的更多相关文章

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

    currentTarget始终是监听事件者,而target是事件的真正发出者.

  2. Flex的 Event中属性currentTarget与target的差别

    Flex的 Event中属性currentTarget与target的差别 1.差别 (1)currentTarget是事件的处理对象(event processor) (2)target是事件的调用 ...

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

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

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

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

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

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

  6. event.target和event.currentTarget区别

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

  7. event.currentTarget指向事件所绑定的元素,而event.target始终指向事件发生时的元素

    event.currentTarget指向事件所绑定的元素,而event.target始终指向事件发生时的元素

  8. Event.target和Event.currentTarget的区别

    <style> * { margin:0; padding:0; list-style:none; } #ul { width:400px; height:250px; margin:0 ...

  9. JavaScript Event Delegation, and event.target vs. event.currentTarget

    原文:https://medium.com/@florenceliang/javascript-event-delegation-and-event-target-vs-event-currentta ...

随机推荐

  1. Drainage Ditches(网络流(EK算法))

    计算最大流,EK算法模板题. #include <stdio.h> #include <string.h> #include <queue> using names ...

  2. idea导入ssm项目启动tomcat报错404

    用idea写ssm项目,基于之前一直在用spring boot  对于idea如何运行ssm花费了一番功夫 启动Tom act一直在报404 我搜了网上各种解决办法都不行,花费一天多的时间解决不了 就 ...

  3. kafka与zookeeper实战笔记

    kafka命令 1.先启动zookeeper zkServer.cmd/zkServer.sh2.启动kafka[需要指定server.properties文件] kafka-server-start ...

  4. java常见面试题03-String,StringBuffer,StringBuilder的区别

    面试题   A:String,StringBuffer,StringBuilder的区别 1:String 内容不可变,StringBuffer.StringBudiler可变  2:StringBu ...

  5. (转)JavaScript深入之从原型到原型链

    构造函数创建对象 我们先使用构造函数创建一个对象: function Person() { } var person = new Person(); person.name = 'Kevin'; co ...

  6. Excel的用到的常规的技巧

    这几天在做各种发票的报表,好几百的数据当然离不开EXCel,自己又是个白班,就记录下啦! EXCEL 判断某一单元格值是否包含在某一列中 就在Excel的表格中加入这个函数:=IF(ISERROR(V ...

  7. 在64位WindowsServer2012R2中安装Oracle10g第二版(10.2.0.4.0)-20160106

      1.操作系统版本 用于安装数据库的操作系统镜像文件名为:cn_windows_server_2012_r2_vl_with_update_x64_dvd_6052729.iso 安装DataCen ...

  8. easyui combobox的增加全选解决方案

      1.解决方案背景: 项目中偶然需要用到easyui的combobox的组件,但是本组件自己没有包含全选的api事件.搜索了一些解决方案,但是不是很符合,后来发现是因为所使用的版本不一致所导致的.项 ...

  9. 浅谈Java三大框架与应用

    前言:对于一个程序员来说,尤其是在java web端开发的程序员,三大框架:Struts+Hibernate+Spring是必须要掌握熟透的,因此,下面谈谈java三大框架的基本概念和原理. JAVA ...

  10. 【技术累积】【点】【java】【19】访问权限

    java中的四种访问权限 范围如下表 权限 类内 同包 不同包子类 不同包非子类 Public ✔️ ✔️ ✔️ ✔️ 默认(Default) ✔️ ✔️ ️ Protected ✔️ ✔️ ✔️ P ...