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

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

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

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

<div > click outer 
<p >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 + "\n 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个属性似懂非懂,通过翻阅资料才对其有了个初步的认识。

相关文章:

  • 2021-07-21
  • 2021-06-30
  • 2022-02-19
  • 2022-12-23
  • 2021-05-24
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2021-04-03
  • 2021-11-11
  • 2021-04-19
  • 2022-02-02
  • 2022-12-23
相关资源
相似解决方案