JS中的事件冒泡

js中的事件冒泡指的是：多个元素嵌套的时候，它们就会有层次关系，当这些元素注册了相同的事件时，如果其中一层的元素触发了这个事件，可能导致其它层的元素也触发这个事件，这样一来就会造成混乱。这个情况就是事件冒泡。为了避免这种混乱的发生，我们要想办法阻止事件冒泡的发生。
看一个事件冒泡的例子：

上面是三个相互嵌套的div，样式代码这里省略了，js代码中，分别为这三个div注册了onclick点击事件，但是由于它们是相互嵌套的，因此在点击最外面的div的时候，使得三个div全部触发了点击事件，控制台打印出了三者的id，这就是事件冒泡的结果。
当然我们不想要这种结果，于是有了下面的阻止冒泡的方法：


阻止事件冒泡的方法就是分别为每个事件传入一个参数e，然后在事件代码中加入一句e.stopPropagation();就是这么简单。
但是这种方法也有缺憾，就是它能够兼容chrome和firefox以及IE9以上的浏览器，但是不能兼容IE8及以下的浏览器。
IE8及以下的浏览器阻止事件冒泡的语句为window.event.cancelBubble=true;这种方法chrome也支持，但是firefox不支持。