一句话区分currentTarget和target

currentTarget：事件处理程序注册的元素， target：事件的实际目标元素

下面是2个不一样的场景例子：

场景1：事件处理程序注册的元素 === 事件的实际目标元素

<div id="div">
	<button id='ele'>按钮</button>
</div>

var ele = document.getElementById('ele');
ele.onclick = function(e){
	console.log(e.target == this);  //true
	console.log(e.currentTarget == this);  //true
}
复制代码

在事件处理程序内部，对象this始终等于currentTarget ，而target则只包含事件的实际目标。

事件处理程序注册的元素和事件的实际目标元素都是button，因此e.currentTarget == e.target == this

场景2：事件处理程序注册的元素 != 事件的实际目标元素

<div id="div">
	<button id='ele'>按钮</button>
</div>


var ele = document.getElementById('ele');
var div = document.getElementById('div');

//当点击页面的按钮时
div.onclick = function(e){
	console.log(e.currentTarget == this);  //true
	console.log(this == div);  //true
	console.log(e.target == ele);  //true
}
复制代码

当点击页面的按钮时，this 和currentTarget 都等于div，由于事件处理程序是注册在这个元素上的；而target 等于ele，由于ele才是click事件的真正目标。

因为按钮上并无注册事件处理程序，结果click事件冒泡到了div上，在那里事件才获得处理。

---

注意：使用attachEvent和detachEvent注册事件时，事件处理程序会在全局做用域中运行，此时this == window