jquery：e.target和this的区别

Posted 2020-09-07 jacksplwxy

<ul name=‘grandfather‘>
    <li name=‘father‘>
        标题1
        <div name=‘son‘>1
　　　　　　<div>4</div>

　　　　　　<div>5</div>　

　　　 　</div>
        <div>2</div>
        <div>3/div>
    </li>
    <li>
        标题2
        <div>2</div>
    </li>
    <li>
        标题3
        <div>3</div>
    </li>
</ul>

$(‘ul‘).on(‘click‘,‘li‘,function(){
　　//event.stopPropagation();
    console.log(‘this是‘+$(this).attr(‘name‘))
    console.log(‘$this的儿子的name是‘+$(this).children().attr(‘name‘))
    $(this).children().css(‘color‘,‘red‘);
});

e.target是点击的目标元素；

this也是点击的目标元素，但因为事件会冒泡，所以this最终会指向事件所绑定的元素（这里是li）；

当上述代码中加入event.stopPropagation()后，冒泡被阻止，this与e.target效果一样。（待验证）