首先本質(zhì)區(qū)別是：
event.target返回觸發(fā)事件的元素
event.currentTarget返回綁定事件的元素
????舉個例子：
1
7varul = document.getElementById("ul");8ul.onclick =function(event){9vartar = event.target;10vartagName = tar.nodeName.toLowerCase();11console.log("你點(diǎn)擊了:"+tagName);12event.preventDefault();13}14
當(dāng)我點(diǎn)擊哪個元素時森爽，event.target返回的是點(diǎn)擊的元素節(jié)點(diǎn)，我們可以用返回的節(jié)點(diǎn)使用一些DOM對象上的一些操作捌归。這里event.preventDefault，是用來阻止點(diǎn)擊a默認(rèn)跳轉(zhuǎn)，刷新頁面導(dǎo)致結(jié)果不能輸出來的一個作用。
event.currentTarget的作用是什么呢，我覺得他和this 的作用是差不多的蜀踏，始終返回的是綁定事件的元素
實(shí)際使用中target的妙用：
target事件委托的定義：本來該自己干的事，但是自己不干掰吕，交給別人來干。比如上面的例子中颅痊，應(yīng)該是ul li a 來監(jiān)控自身的點(diǎn)擊事件殖熟，但是li a自己不監(jiān)控這個點(diǎn)擊事件了，全部交給li父節(jié)點(diǎn)和a祖父節(jié)點(diǎn)ul來監(jiān)控自己的點(diǎn)擊事件斑响。一般用到for循環(huán)遍歷節(jié)點(diǎn)添加事件的時候都可以用事件委托來做菱属，可以提高性能。
來個案例：一個添加刪除的demo舰罚。
9varbutton = document.getElementById("button");10vartext = document.getElementById("text");11varul = document.getElementsByTagName("ul")[0];12varbtnClass = document.getElementsByClassName("btn");13button.onclick =function(){14vardeleteButton = document.createElement("button");15varvalue = text.value;16deleteButton.setAttribute("class","btn");17vardeleteText = document.createTextNode("刪除");18deleteButton.appendChild(deleteText);19varli = document.createElement("li");20varliText = document.createTextNode(value);21li.appendChild(liText);22li.appendChild(deleteButton);23ul.appendChild(li);24for(vari=0;i
為什么在第24行也需要一個for循環(huán)纽门，給每個刪除按鈕添加事件呢，因?yàn)橥饷娴膄or循環(huán)营罢，在文檔刷新時給頁面中存在的三個刪除按鈕添加了點(diǎn)擊事件赏陵，而后來添加的刪除按鈕并沒有綁定事件，導(dǎo)致頁面中存在的三個li標(biāo)簽可以刪除饲漾，而后來新添加的li不能刪除這個問題蝙搔。我們使用事件委托來做就不用這么麻煩了
給ul添加了點(diǎn)擊事件，點(diǎn)擊ul里面的子元素考传，event.target都會返回當(dāng)前點(diǎn)擊的元素節(jié)點(diǎn)吃型，做一個判斷，如果點(diǎn)擊了button標(biāo)簽僚楞，刪除這個li節(jié)點(diǎn)勤晚。由于添加的li都在ul節(jié)點(diǎn)里面枉层，所以并不用再去添加li事件里面去寫代碼了，是不是很方便呢赐写。
