target是指獲取事件的目標(biāo)
currentTarget是指其事件處理程序當(dāng)前正在處理事件的那個元素
this和currentTarget的關(guān)系：
在事件處理程序內(nèi)部，對象this始終等于currentTarget的值。
在什么情況下target和currentTarget相等
當(dāng)事件處理程序直接綁定在目標(biāo)元素上，此時e.target===e.currentTarget，e.target ===this
不相等的時候
當(dāng)事件處理程序綁定在目標(biāo)元素的父節(jié)點(diǎn)上時，currentTarget會指向綁定的父元素，而target依舊指向目標(biāo)元素apple
<body>
<ul id="box">
<Li id="apple">蘋果</Li>
<li>香蕉</li>
<li>桃子</li>
</ul>
</body>
<script type="text/javascript">
var box = document.getElementById('box');
var apple = document.getElementById('apple');
//直接綁定在目標(biāo)元素apple上
apple.onclick = function (e){
console.log(e.target); //<li id="apple">蘋果</li>
console.log(e.currentTarget); //<li id="apple">蘋果</li>
console.log(this); //<li id="apple">蘋果</li>
console.log(e.target === e.currentTarget); //true
console.log(e.target === this); //true
}
//綁定在apple的父元素box上
box.onclick = function (e){
console.log(e.target); // <li id="apple">蘋果</li>
console.log(e.currentTarget); //<ul id="box">...</ul>
console.log(this); //<ul id="box">...</ul>
console.log(e.currentTarget===this); //true
console.log(e.target === e.currentTarget); //false
console.log(e.target === this); //false
}
</script>
浙公網(wǎng)安備 33010602011771號