e.currentTarget Versus e.target
這篇介紹e.currentTarget和e.target兩者差異，當一個dom物件被觸發一個事件後，事件會冒泡，如果冒泡到父節點，且父節點也bind相同e.事件的話就會觸發該事件。
這是可通過e.currentTarget 和 e.target來判斷事件的bind物件和觸發物件分別是誰。
Example
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| HTML:
<ul id="fa">
<li class="son1">son1</li>
<li class="son2">son2</li>
<li class="son3">son3</li>
</ul>
JavaScript:
let fa = document.getElementById('fa');
fa.onclick = function(e) {
console.log(`%ccurrentTarget: %c${e.currentTarget.innerHTML}`, 'color: red', 'color: red');
console.log(`%ctarget: %c${e.target.innerHTML}`, 'color: yellow', 'color:yellow');
}
當點選<ul></ul>相當於在id=fa的節點上觸發時間，因此target、currentTarget均指向id=fa節點
當點選<li>son1、son2、son3</li>時，事件是在子節點觸發，但事件是繫結在父節點上，因此currentTarget指向ul節點，target指向li節點
|
結論
1
2
| e.currentTarget：指的是註冊事件物件
e.target：指的是實際觸發事件的物件
|