冒泡事件和默认事件

什么是冒泡事件

在一个对象上触发某类事件（比如单击click事件），如果对象定义了此事件处理程序，那么此事件就会调用这个处理程序，如果没有定义此事件的处理程序或者事件返回true，那么这个事件会向这个对象的父级对象传播，从里到外，直至他被处理（腹肌对象的所有同类事件都将被激活），或者他达到了对象层次的最顶级，即document对象（有些浏览器是window）

什么是默认事件

浏览器的一些默认行为。例如：点击超链接跳转，滑动滚动条控制滚动条
滚动
事实上stoppropagation和cancelBubble的作用是一样的，都是用来阻止浏览器默认的事件冒泡行为。
不同之处在于stoppropagation属于W3C标准，试用于Firefox等浏览器，但是不支持IE浏览器。相反cancelBubble不符合W3C标准，而且只支持IE浏览器。所以很多时候，我们都要结合起来用。不过，cancelBubble在新版本chrome,opera浏览器中已经支持。

如何阻止冒泡事件（W3C）

阻止冒泡事件，不让事件向window蔓延，默认事件依旧会执行

<div>
	<div id="box"></div>
</div>

document.getElementById("box").addEventListener("click", function(event){
 var event = event || window.event;
 event.stoppropagation ? event.stoppropagation() :  event.cancelBubble=true;

});

如何阻止默认事件（W3C）

阻止默认事件完成后会发生冒泡事件，冒泡会传递到上一层的父元素

<div>
	<a href="#"></div>
</div>

document.ggetElementsByTagName("a").addEventListener("click", function(e){
	e = e || window.e;
	e.preventDefault ? e.preventDefault() : e.returnValue = false; 
});

事件注意点

event代表事件的状态，例如触发event对象的元素、鼠标的位置及状态、按下的键等等；
event对象只在事件发生的过程中才有效。
firefox里的event跟IE里的不同，IE里的是全局变量，随时可用；firefox里的要用参数引导才能用，是运行时的临时变量。
在IE/Opera中是window.event，在Firefox中是event；而事件的对象，在IE中是window.event.srcElement，在Firefox中是event.target，Opera中两者都可用。

下面两句效果相同：

function a(e){
	var e = (e) ? e : ((window.event) ? window.event : null); 
	var e = e || window.event; // firefox下window.event为null, IE下event为null
}