1. 第一种情况:就是IE9+和其他现代浏览器,支持addEventListener方法。其结果是:

    • this总是等于currentTarget
    • currentTarget总是事件监听者
    • target总是事件发起者
  2. 第二种情况:就是IE678,使用attachEvent方法注册事件。其结果是:

    • this总是等于window
    • target和currentTarget总是undefined,也就是未定义
    • IE专有的srcElement,含义和上面的target一致。总是等于事件发起者
  3. 第三种情况:使用jquery来绑定事件,这里是直接绑定在某个元素上面:

    • this总是等于currentTarget
    • currentTarget总是事件监听者
    • target总是事件发起者
    • 还有一个delegateTarget,这里总是等于currentTarget
  4. 第四种情况:使用jquery来绑定事件,不过这里使用委托:

    $(".con1").on("click", ".btn1", sayClassName);
    • this总是等于currentTarget
    • currentTarget总是事件监听者,这里就是.btn1元素
    • target总是事件发起者,这里也是.btn1元素
    • 还有一个delegateTarget,这里就是委托事件的元素,也就是.con1元素

    如果是下面的代码:

    $(".con1").on("click", ".con2", sayClassName);

    那么delegateTarget还是.con1元素;currentTarget则是.con2元素;target则是.btn1元素;其中.btn1元素是.con2元素的子元素,.con2元素是.con1元素的子元素;

    如果是下面的代码:

    $(".btn1").on("click", ".btn1", sayClassName);

    那么在jquery中是无效的,也就是不能在自己身上委托事件。

总结

总结就是我们只需要关注currentTarget就OK了!

target,currentTarget,delegateTarget,srcElement的更多相关文章

  1. JS的Event各种属性级target/currentTarget/relatedTarget各种目录的解释

    1.Event属性解释:https://developer.mozilla.org/zh-CN/docs/Web/API/Event 2.Event.target/currentTarget/rela ...

  2. 事件触发函数中的this,target,currentTarget,srcElement

    要解释其中的区别,首先要理解浏览器的事件机制, 现在主流的浏览器事件基本是先捕获再冒泡,IE浏览器只有冒泡阶段 事件是在冒泡阶段触发的 看看这个HTML 当我点击"我是父节点的时候" ...

  3. 捕获当前事件作用的对象event.target和event.srcElement

    语法: //返回事件的目标节点(触发该事件的节点). event.target //FF,Chrome event.srcElement //IE 栗子: var oDiv=document.getE ...

  4. js中event.target和event.srcElement的区别

    看了很多资料绝对结果就是 firefox 下的 event.target = IE 下的 event.srcElement jquery中的event.target属性的作用是获取到出发事件的元素.j ...

  5. e.target 和 e.srcElement 的使用问题

    ie 下的event.srcElement从字面上可以看出来有以下关键字:事件.源(它的意思就是:当前事件的源), 我们可以调用他的各种属性就像:document.getElementById(&qu ...

  6. event.target与event.srcElement

    target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素.文档或窗口. 在标准浏览器下我们一般使用event.target就能解决,然而低版本IE浏览器总是会出些幺蛾子,这时候 ...

  7. e.target和e.srcElement

    IE下,event对象有srcElement属性,但是没有target属性; Firefox下,event对象有target属性,但是没有srcElement属性.但他们的作用是相当的,即: fire ...

  8. target vs currentTarget, clientWidth vs offsetWidth

    width: document < window(browser) < screen document--> clientWidth < offsetWidth(include ...

  9. event.srcElement与event.target的区别

    window.event.srcElement与window.event.target 都是指向触发事件的元素,它是什么就有什么样的属性 srcElement是事件初始化目标html元素对象引用,因为 ...

随机推荐

  1. Struts2 Tomcat的配置

    1. 下载Struts2包,网站http://struts.apache.org/download.cgi#struts2315 2. 将struts-2.3.15-all.zip 包解压到本地 3. ...

  2. SharePoint DataFormWebPart 通过Caml和xslt聚合内容

    以下是一个例子,SPDataSource用于查询内容,DatasourceMode属性指定查询范围(网站集,网站,列表),SelectCommand是Caml查询:Xsl展示内容,下面列子是用tabl ...

  3. 简化 Django

    http://www.oschina.net/translate/simplifying-django 尽管Django的流行和普及, 一些开发者仍然认为她是一个过时的web开发框架, 仅仅适合内容丰 ...

  4. VS2012中使用Boost库的方法(超级简单)

    很不错的博客一定得看 http://my.csdn.net/caimouse 1.下载boost库 从http://www.boost.org上下载到目前最新的boost库,快速传送门:boost_1 ...

  5. NtQuerySystemInformation的使用(提供50余种信息)

    今天,我们主要讨论的是一个函数NtQuerySystemInformation(ZwQuerySystemInformation).当然,你不要小看这么一个函数,它却为我们提供了丰富的系统信息,同时还 ...

  6. 【HDOJ】3295 An interesting mobile game

    其实就是一道搜索模拟题.因为数据量小,用char就够了. /* 3295 */ #include <iostream> #include <cstdio> #include & ...

  7. 【Linux】鸟哥的Linux私房菜基础学习篇整理(五)

    1. type [-tpa] name:查看name命令是否为bash内置命令.参数:type:不加任何参数,type会显示出那么是外部命令还是bash的内置命令:-t:当加入-t参数时,type会通 ...

  8. Unity NGUI实现技能CD效果

    unity版本:4.5.1 NGUI版本:3.6.5 脚本代码:C# 在游戏中经常要实现技能的CD效果,NGUI中已经实现了这个功能,即在button上创建一个半透明的Sprite实现这个功能. 首先 ...

  9. POJ-Common Substrings(后缀数组-长度不小于 k 的公共子串的个数)

    题意: 长度不小于 k 的公共子串的个数 分析: 基本思路是计算 A 的所有后缀和 B 的所有后缀之间的最长公共前缀的长度,把最长公共前缀长度不小于 k 的部分全部加起来. 先将两个字符串连起来,中间 ...

  10. 图论(网络流):SCOI 2007 修车

    同一时刻有N位车主带着他们的爱车来到了汽车维修中心.维修中心共有M位技术人员,不同的技术人员对不同的车进行维修所用的时间是不同的.现在需要安排这M位技术人员所维修的车及顺序,使得顾客平均等待的时间最小 ...