共计 687 个字符，预计需要花费 2 分钟才能阅读完成。
明天在看一段代码的时候发现了一个 event.target，那么什么是 event.target 呢
target 属性可返回触发事件的指标节点，简略来说，他会返回鼠标所点击的间接触发事件的节点。 从这点来说，与 this 是非常相像的，那么两者有什么区别呢
<body>
<ul>
<li> 我是第 1 个元素 </li>
<li> 我是第 2 个元素 </li>
<li> 我是第 3 个元素 </li>
<li> 我是第 4 个元素 </li>
<li> 我是第 5 个元素 </li>
</ul>
</body>
<script>
$("li").click(function (event) {console.log(this)
console.log(event.target);
})
</script> 当咱们点击第一个 li 标签时，两者输入的后果是一样的
当给父元素 ul 标签增加同名函数（触发事件冒泡）
<script>
$("ul").click(function (event) {console.log(this)
console.log(event.target);
})
</script> 此时点击第一个 li 标签的时候，this 输入了 ul 标签，而 event.target 输入了 li 标签
由此能够看出，在没有事件冒泡的时候，this 与 event.target 返回值是雷同的，都为触发事件的指标节点，而当触发事件冒泡后，this 变为 ul 标签，而 event.target 依然为 li 标签
总结：this 与 event.target 的区别为 this 可变，当含有事件冒泡时，this 始终指向该函数的调用者，而 event.target 则不会变，始终指向触发该事件的指标节点 。
正文完
发表至： javascript
2020-08-12
