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. mount -o remount,rw /

    init=/bin/sh mount -o remount,rw /; sed -i 's/指定字符串/&希望插入的字符串/' 文件 在一文件中指定的字符后插入内容 sed -i 's/指定的 ...

  2. 基于Spark的网站日志分析

    本文只展示核心代码,完整代码见文末链接. Web Log Analysis 提取需要的log信息,包括time, traffic, ip, web address 进一步解析第一步获得的log信息,如 ...

  3. wap网测一道题目

    1. 给定一个字符串s, 1 <= len(s) <= 3000, 定义odd palindrome string为长度为奇数的回文串, 求s中该奇回文串的个数. 比如axbcba , 结 ...

  4. wap 5.23 网测几道题目

    1. n个犯人,m个省份, 如果相邻的2个犯人来自同一省份,则是不安全的,求不安全的个数. 正难则反,用全部的个数减去非法的个数,就是最后的答案. m^n - m * (m - 1) ^ (n - 1 ...

  5. Y - Anton and Letters

    Problem description Recently, Anton has found a set. The set consists of small English letters. Anto ...

  6. C#之MD5加密

    C#实现MD5加密 方法一 首先,先简单介绍一下MD5 MD5的全称是message-digest algorithm 5(信息-摘要算法,在90年代初由mit laboratory for comp ...

  7. spring框架搭建(一)

    spring介绍 spring是一个轻量级控制反转(IOC)和面向切面(AOP)的容器框架,它主要是为了解决企业应用开发复杂性而诞生的. 简单来说spring是一个一站式轻量级开源框架. IOC:In ...

  8. resultType和resultMap区别,,,1-1一个订单只能对应一个用户,1对多,一个用户对应多个订单

    -----------------1-多

  9. 智能识别快递地址api接口实现(PHP示例)

    电商.ERP等行业发货时,批量录入图片上的收件人地址是个难题:智能识别收件人API是近乎完美的解决方案,通过识别图片,解析出图片中收件人的姓名.电话.详细地址(省.市.区/县.详细地址).将此接口集成 ...

  10. HTML简单入门

    - Java攻城狮学习路线 - 基本结构 标准文档:www.w3.org <!DOCTYPE html> <html> <head> <meta charse ...