想必大家对它们都很熟悉,但是你知道它们的区别么?今天我就通过一个简单的例子向大家详细介绍一下这两个的区别。
首先,你需要了解的是JavaScript的事件冒泡和事件捕捉。
事件冒泡:触发事件时,当到达事件目标时不会立即结束,会逐层向上冒泡。
事件捕获:与事件冒泡相反,事件发生时,最先发生的是document。
有了上面的知识,现在进入本文重点。event.target直接指向事件目标,是不会随着事件冒泡的发生而改变;而this是指向调用该方法的对象。
下面来以一个例子来说明. 有个块级元素内含行内元素,点击时则输出该元素的ID。当我点击span ,由于冒泡的原因,而this 指向调用当前方法的对象。所以会先输出span 元素的ID,后输出 p 元素的ID。
当我使用的是event.target时,点击span元素时,两次均输出了span元素的ID。