target在事件流的目标阶段;currentTarget在事件流的捕获,目标及冒泡阶段。只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的对象而currentTarget指向当前事件活动的对象(一般为父级)。

 1     <div id="outer" style="background:#099">  
2 click outer
3 <p id="inner" style="background:#9C0">click inner</p>
4 <br>
5 </div>
6
7 <script type="text/javascript">
8 function G(id){
9 return document.getElementById(id);
10 }
11 function addEvent(obj, ev, handler){
12 if(window.attachEvent){
13 obj.attachEvent("on" + ev, handler);
14 }else if(window.addEventListener){
15 obj.addEventListener(ev, handler, false);
16 }
17 }
18 function test(e){
19 alert("e.target.tagName : " + e.target.tagName + "\n e.currentTarget.tagName : " + e.currentTarget.tagName);
20 }
21 var outer = G("outer");
22 var inner = G("inner");
23 //addEvent(inner, "click", test);
24 addEvent(outer, "click", test);
25 </script>

上面的示例中,当在outer上点击时,e.target与e.currentTarget是一样的,都是div;当在inner上点击时,e.target是p,而e.currentTarget则是div。

jS事件:target与currentTarget区别的更多相关文章

  1. JavaScript target与currentTarget区别

    1.DOM事件绑定到父元素 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=& ...

  2. 微信小程序中的target和currentTarget区别

    最近在学习微信小程序相关知识,其中提到了两个属性target和currentTarget,其中target是指向触发事件的元素(常见于事件委托中),而currentTarget是指向捕获事件的元素(即 ...

  3. 事件:target与currentTarget区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  4. target与currentTarget区别 ( html是弹窗居中的例子)

    <!DOCTYPE html> <html> <head> <title></title> <style type="tex ...

  5. target与currentTarget区别

    target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的 ...

  6. js中的target与currentTarget的区别<转>

    关于js中target与currentTarget的区别的关键在于他们所处在的事件流的阶段是不一样的,target处于事件流的目标阶段,currentTarget处理事件流的捕获.处于目标阶段和冒泡阶 ...

  7. js事件绑定的几种方式与on()、bind()的区别

    版权声明:本文为博主原创文章,未经博主允许不得转载 一直不是很理解几种js事件绑定之间的区别与联系,今天百度了一下,在此做一总结: 1.如果只是简单的绑定一个事件,可以直接写在行内,点击执行一个函数, ...

  8. 三言两语之js事件、事件流以及target、currentTarget、this那些事

    厉害了我的哥--你是如此简单我却将你给遗忘   放假前再看某文档,里边提到两个我既熟悉又陌生的概念target.currentTarget,说他熟悉我曾经看到过这两个事件对象的异同处,说他陌生吧?很不 ...

  9. 事件冒泡和事件捕获以及解释target和currenttarget的区别

    冒泡和捕获的区别是冒泡事件是先触发子元素事件,再触发父元素事件,这个是冒泡.捕获是先触发父元素事件,再触发子元素事件.简单的来说,冒泡的顺序是由内到外,捕获的顺序是由外到内 举例:<!DOCTY ...

随机推荐

  1. VS2010 自动跳过代码现象

    今日,发现在Release的调试模式下,VS2010会“莫名其妙”的跳过一些代码不执行. 经实验,初步判断可能的原因:预处理器指令或编译器/连接器优化. 20150703更新: 部分代码: m_pTa ...

  2. 【131031】struts 1 中 <html:form>

    <DIV>来看看 使用 ActionForm 这个主题,当时使用了一个静态表单网页:<BR>* form.htm<BR><BR><BR>&l ...

  3. gcc参数-l传递顺序错误导致`undefined reference'的一点小结

    刚才编译一个pthread的单文件程序, 使用的命令行是: gcc -o thread1 -lpthread thread1.c 结果报错: $ gcc -o thread1 -lpthread th ...

  4. MyEclipse 选中右侧编辑的文件时自动展开左侧目录树

  5. Junit的简单使用

    Junit是一个很好用的单元测试工具,下面是使用Junit来测试方法的简单案例: import java.util.ArrayList; import java.util.Iterator; impo ...

  6. SoapUI之webservice接口测试(一)

    1.新建soap project 添加后出现接口内容 2.为了方便后续的测试,以防某些参数删除错了,这边需要新建测试集 3.点开新建的测试集可以发现,里面的内容跟原始测试集内容是一样的 然后就可以在这 ...

  7. Linux解压文件

    zip: 解压:unzip filename 解压到tmp文件夹:unzip filename.zip -d /tmp 查看压缩文件而不解压:unzip filename.zip -v tar.gz: ...

  8. SpringHttpInvoker解析1-使用示例

    HTTP invoker是一个新的远程调用模型,作为Spring框架的一部分,来执行基于HTTP的远程调用(让防火墙可以接受),并使用Java的序列化机制. 服务端 定义服务接口UserService ...

  9. DOM--3 DOM核心和DOM2 HTML(2)

    核心Node对象 由于继承扩展的关系,DOM中大部分对象会有Node对象的属性和方法,其中包括: nodeName DOM2核心中规定的每种nodeType预期的nodeName值 对象 返回值 El ...

  10. hdu5432 二分

    Pyramid Split Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Tot ...