target和currentTarget区别

target和currentTarget区别

target:触发事件的元素
currentTarget:事件绑定的元素

<ul id="ulT">
    <li class="item1">1</li>
    <li class="item2">2</li>
    <li class="item3">3</li>
    <li class="item4">4</li>
    <li class="item5">5</li>
</ul>

此时target和currentTarget是一样的 都是点击的li标签

var lis = document.querySelectorAll('li');
for(var i =0;i<lis.length;i++){
    lis[i].onclick= function (e) {
        console.log(e.target);  //<li class="item1">1</li>
        console.log(e.currentTarget); //<li class="item1">1</li>
    }
}

此时是不一样的

var ul = document.querySelector('ul');
ul.addEventListener('click', function (e) {
    console.log(e.target);  //当前的li
    console.log(e.currentTarget); //元素的ul
})