target与currentTarget区别

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

<div id="outer" style="background:#099"> 
        click outer 
        <p id="inner" style="background:#9C0">click inner</p> 
        <br> 
    </div> 
     
    <script type="text/javascript"> 
    function G(id){ 
        return document.getElementById(id);     
    } 
    function addEvent(obj, ev, handler){ 
        if(window.attachEvent){ 
            obj.attachEvent("on" + ev, handler); 
        }else if(window.addEventListener){  
            obj.addEventListener(ev, handler, false); 
        } 
    } 
    function test(e){ 
        alert("e.target.tagName : " + e.target.tagName + "\n e.currentTarget.tagName : " + e.currentTarget.tagName); 
    } 
    var outer = G("outer"); 
    var inner = G("inner"); 
    //addEvent(inner, "click", test); 
    addEvent(outer, "click", test); 
    </script>

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

时间: 2024-10-03 10:11:38

target与currentTarget区别的相关文章

JavaScript target与currentTarget区别

1.DOM事件绑定到父元素 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Co

jS事件:target与currentTarget区别

target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的对象而currentTarget指向当前事件活动的对象(一般为父级). 1 <div id="outer" style="background:#099"> 2 click outer 3 <p id="inner" style=&

事件:target与currentTarget区别

target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.只有当事件流处在目标阶段的时候,两个的指向才是一样的, 而当处于捕获和冒泡阶段的时候,target指向被单击的对象而currentTarget指向当前事件活动的对象(一般为父级). 1 <div id="outer" style="background:#099"> 2 click outer 3 <p id="inner" style=&

target与currentTarget区别的简单讲解

来自为w3schol(http://www.w3school.com.cn/jsref/dom_obj_event.asp)上的解释为: target    返回触发此事件的元素(事件的目标节点). currentTarget    返回其事件监听器触发该事件的元素. 看例子: <div id="outer"> outer <p> inner </p> </div> <script type="text/javascrip

target与currentTarget的区别

我的理解在下面的代码中显示,currentTarget比target来的更具体些,点那个就是哪个 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l

关于js中event的target和currentTarget的区别

今天又遇到这个问题了,总是搞不清楚target和currentTarget的区别,百度搜索的时候看到一遍文章解释得很清楚,特意记录下录,以备不时之需: target与currentTarget的区别? 通俗易懂的说法: 比如说现在有A和B, A.addChild(B) A监听鼠标点击事件 那么当点击B时,target是B,currentTarget是A 也就是说,currentTarget始终是监听事件者,而target是事件的真正发出者 总结: target在事件流的目标阶段:currentT

target与currentTarget与this的区别

target与currentTarget与this的区别: target在事件流的目标阶段:currentTarget在事件的捕获.目标及冒泡阶段. 只有当事件流处在目标阶段的时候,二者的指向才是一致的. 当处于捕获和冒泡阶段的时候,target指向被单击的对象,而currentTarget指向当前事件活动的对 象(注册该事件的对象,一般为父级). this指向永远和currentTarget指向一致(这里只针对this的普通函数调用). target与currentTarget的区别: eve

target与currentTarget的区别(jqueryui方式获取z-Index)

作者:zccst 原文 :http://zccst.iteye.com/blog/2081412 2014-6-25 今天看了jQuery手册,发现jQuery的事件对象模块也有一个currentTarget,始终指向this. 所以结论是:原生的currentTarget与jQuery的currentTarget完全不是一回事.要重点区别对待. 2014-6-17 target与currentTarget的区别? 通俗易懂的说法: 比如说现在有A和B, A.addChild(B) A监听鼠标点

js中的target与currentTarget的区别&lt;转&gt;

关于js中target与currentTarget的区别的关键在于他们所处在的事件流的阶段是不一样的,target处于事件流的目标阶段,currentTarget处理事件流的捕获.处于目标阶段和冒泡阶段.只有当他们同事处于目标阶段的时候他们的指向才是一样的,请看以下代码: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>js性能优化</title