• 浅析e.target与e.currentTarget的区别


    简单的说,e.curretnTarge是指注册了事件监听器的对象,e.target是指对象里的子对象,实际触发这个事件的对象。

    在《JavaScript高级高级程序设计》中,对这2个属性说明如下:

     
    属性/方法 类型 读/写 说明
    target Element 只读 事件的目标
    currentTarget Element 只读 其事件处理程序当前正在处理事件的那个元素

    我们通过一个简单的例子来说明:

    <div id="outer" style="background:#099"> click outer 
    <p id="inner" style="background:#9C0">click inner</p> 
    </div>
    

      

    function $(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 + "
     e.currentTarget.tagName : " + e.currentTarget.tagName);
      }
      var outer = $("outer");
      var inner = $("inner");
      addEvent(inner, "click", test);
      addEvent(outer, "click", test);
    

      在outer上点击时,target跟currentTarget是一样的,都是div,而在inner上点击时,e.target是p、e.currentTarget是div。

      目前,我也对这2个属性似懂非懂,通过翻阅资料才对其有了个初步的认识。

  • 相关阅读:
    array_count_values源码
    php 编译安装记录
    mysql 安装的过程做个记录
    初识highcharts 库
    php 不重新编译增加新扩展的方法
    备考PMP
    Beyond Compare4破解--写reg脚本删除注册表
    SourceTree 跳过登录
    正则 (?=exp)
    springmvc--处理器的返回参数
  • 原文地址:https://www.cnblogs.com/d-12315/p/5652582.html
Copyright © 2020-2023  润新知