熟悉jquery的小夥伴應該都知道jquery獲取當前點擊對象是有多麼的粗暴，直接$(dom)獲取當前點擊的dom元素，根據這個，幾乎可以獲取這個dom元素的所有屬性。不過，當我們使用vue的時候呢？
也許剛開始會有一點迷茫。唉？對啊，我用vue該怎麼做到(屠龍寶刀)點擊就送...哦不，點擊就能獲取到我點擊的是哪一個元素對象呢？其實很簡單，vue.js，它不照樣是javascript麼，我們也是可以通過點擊事件來傳遞$event事件的。
我們來看一下javascript文檔上有關event標準屬性的介紹：
| 屬性 | 描述 |
|---|---|
| bubbles | 返回布爾值，指示事件是否是起泡事件類型。 |
| cancelable | 返回布爾值，指示事件是否可擁可取消的默認動作。 |
| currentTarget | 返回其事件監聽器觸發該事件的元素。 |
| eventPhase | 返回事件傳播的當前階段。 |
| target | 返回觸發此事件的元素（事件的目標節點）。 |
| timeStamp | 返回事件生成的日期和時間。 |
| type | 返回當前 Event 對象表示的事件的名稱。 |
先來看看第三個屬性：
currentTarget：currentTarget 事件屬性返回其監聽器觸發事件的節點，即當前處理該事件的元素、文檔或窗口。
通俗一點說，就是你的點擊事件綁定在哪一個元素上，currentTarget獲取到的就是哪一個元素。
再來看看第五個屬性：
target：target 事件屬性可返回事件的目標節點（觸發該事件的節點），如生成事件的元素、文檔或窗口。
通俗一點說，就是你當前點擊的是哪一個元素，target獲取到的就是哪一個元素。
可能這樣說大家還是不太明白，下面我們就以vue來舉一個小例子：
模版代碼：
<li v-for="img in willLoadImg" @click="selectImg($event)"> <img class="loadimg" :src="img.url" :data-id="img.id" alt=""> </li>
我們給li標籤綁定了一個點擊事件selectImg()，傳入了$event對象。(這裏循環遍歷了一個圖片數組，是爲了展示更好的效果，如有需要請自行定義數組及其對應的圖片，可不要只是完全複製了代碼來問我爲什麼報錯神馬的)
事件方法代碼：
methods: {
selectImg(event) {
console.log(event.currentTarget);
console.log(event.target);
}
}模版效果圖：
同樣的，爲了演示效果，我們選擇了兩張豎直方向比較長的圖片並做了左右居中的處理。(灰色邊框之內都屬於li標籤)
接下來我們先點擊空白區域(即只點擊li標籤，不點擊img圖片)：
控制檯輸出：
我們展開看一下：
我們發現，當前點擊事件下無論是currentTarget還是target獲取到的都是完整的li。好像沒有什麼區別。
我們再來點擊中間的圖片區域：
控制檯輸出：
我們發現，當前點擊事件下currentTarget獲取到的是完整的li，而target獲取到的只有完整img標籤。
相信小夥伴們已經看出了不同之處：
我們的事件綁定在li標籤上，無論我們只點擊li標籤還是點擊li標籤下的子級img圖片，currentTarget屬性獲取到的都是我們事件所綁定的那一個元素(即li標籤)，而target屬性獲取到的是我們點擊的那一個元素。
好啦，理解了這些之後，相信大家以後就能快速實現自己項目中獲取當前點擊對象的功能了，就不會再迷茫於我是用currentTarget還是target，也不會再疑惑於爲什麼我獲取到的點擊對象好像有些不太對不能滿足我的需要了。
也許還有人會問，獲取當前點擊對象其實沒什麼用唉，實際項目中更需要的是獲取對象的屬性。。。。。。。。。。。。。。。。好吧，既然理解了vue其實還是javascript，獲取對象屬性很難麼