代碼測試：
復制代碼 代碼如下:
<div id="test"><p>test text<p></div>
<script src="vendor/jquery-2.1.1.js"></script>
<script>
test.addEventListener('click', function(e){console.log(e);}, false),
$('#test').on('click', function(e){console.log(e)});
</script>
結果分析：
復制代碼 代碼如下:
js-jq-event-common:{
altKey: false,
bubbles: true,
button: 0,
cancelable: true,
clientX: 58,
clientY: 13,
ctrlKey: false,
offsetX: 50,
offsetY: 5,
pageX: 58,
pageY: 13,
screenX: 58,
screenY: 122,
view: Window,
which: 1,
type: 'click',
timeStamp: 1407761742842,
metaKey: false,
relatedTarget: null,
target: div#test /*jq-evt的target不一定是jQuery選擇器匹配的元素，可能是第一個捕獲事件的元素，然後向上冒泡時其中一個才是選擇器匹配的元素*/
},
js-jq-event-diff:{
currentTarget: null/*貌似一般都為null*/
|| div#test/*jq選擇器匹配的元素在[currentTarget]屬性*/,
eventPhase: 0 || 2,
toElement: div#test
},
js-event-solo:{
x: 58,
y: 13,
cancelBubble: false,
charCode: 0,
clipboardData: undefined,
dataTransfer: null,
defaultPrevented: false,
srcElement: div#test,
fromElement: null,
detail: 1,
keyCode: 0,
layerX: 58,
layerY: 13,
returnValue: true
},
jq-event-solo: {
buttons: undefined,
data: undefined,
delegateTarget: div#test/*誰在監聽？就是這個元素啦。*/,
isDefaultPrevented: function,
handleObj: Object,
jQuery211024030584539286792: true,
originalEvent: MouseEvent,
shiftKey: false
}
body-click-delegate-event: {
currentTarget: HTMLBodyElement,
delegateTarget: HTMLBodyElement,
target: HTMLDivElement
}
總結：
js的event參數中，不管是target, toElement, srcElement都是指向第一個觸發事件的元素（還沒冒泡），而fromElement在click事件中為null，所以，你如果是設置包含很多元素的父容器parent事件，那麼觸發事件的很可能是這個parent的子元素。
因此，在實際應用中，如果要引用parent,那你只能使用this了
jq的event參數中,
currentTarget是匹配你選擇器的元素，就是你的所要元素；
delegateTarget是在監聽事件的元素，屬於被委托的元素
target同js的event參數裡的target，是第一個觸發事件的元素，沒currentTarget有用（也不一定，比如在bodyclick事件中的應用）
有同學可能說，你要直接引用被設備事件的元素用this就得啦，何必理解currentTarget和target呢。這個想法證明你還只是用下jQuery而已，沒用過類似Backbone之類的工具。
Backbone很多地方綁定了this,所以在它的函數中用this是不行的：
復制代碼 代碼如下:
var view = Backbone.View.extend({
el: document.body,
events: {
'click p': 'showText' // 委托body監聽p的click事件 },
showText: function(e){
var p = e.currentTarget; // [currentTarget]獲取選擇器匹配的元素 this.log(p.innerHTML); // 看到了吧，this並不指向p元素 },
log: function(msg){
console.log(msg);
}
});
雖然JS,JQ中event對象大同小異，但還是有些許區別的，大家是否了解了呢