简单的例子详述event.target 和 this 的区别

      想必大家对它们都很熟悉，但是你知道它们的区别么？今天我就通过一个简单的例子向大家详细介绍一下这两个的区别。

      首先，你需要了解的是JavaScript的事件冒泡和事件捕捉。

      事件冒泡：触发事件时，当到达事件目标时不会立即结束，会逐层向上冒泡。

     事件捕获：与事件冒泡相反，事件发生时，最先发生的是document。

      有了上面的知识，现在进入本文重点。event.target直接指向事件目标，是不会随着事件冒泡的发生而改变；而this是指向调用该方法的对象。

     下面来以一个例子来说明. 有个块级元素内含行内元素，点击时则输出该元素的ID。当我点击span ，由于冒泡的原因，而this 指向调用当前方法的对象。所以会先输出span 元素的ID，后输出 p 元素的ID。

      当我使用的是event.target时，点击span元素时，两次均输出了span元素的ID。