什么是事件？
事件是文档和浏览器窗口中发生的特定的交互瞬间。 事件是javascript应用跳动的心脏，也是把所有东西黏在一起的胶水，当我们与浏览器中web页面进行某些类型的交互时，事件就发生了。
事件可能是用户在某些内容上的点击，鼠标经过某个特定元素或按下键盘上的某些按键，事件还可能是web浏览器中发生的事情，比如说某个web页面加载完成，或者是用户滚动窗口或改变窗口大小。
事件流：
事件流描述的是从页面中接受事件的顺序，但有意思的是，微软（IE）和网景（Netscape）开发团队居然提出了两个截然相反的事件流概念，IE的事件流是事件冒泡流(event bubbling)，而Netscape的事件流是事件捕获流(event capturing)。
事件冒泡：
IE提出的事件流叫做事件冒泡，即事件开始时由最具体的元素接受，然后逐级向上传播到较为不具体的节点，看一下以下示例：
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body onclick="bodyClick()"> ???<div onclick="divClick()"> ???????<button onclick="btn()"> ???????????<p onclick="p()">点击冒泡</p> ???????</button> ???</div> ???<script> ?????????????function p(){ ?????????console.log(‘p标签被点击‘) ??????} ???????function btn(){ ???????????console.log("button被点击") ???????} ????????function divClick(event){ ????????????console.log(‘div被点击‘); ????????} ???????function bodyClick(){ ???????????console.log(‘body被点击‘) ???????} ???</script></body></html>接下来我们点击一下页面上的p元素，看看会发生什么：
正如上面我们所说的，它会从一个最具体的的元素接收，然后逐级向上传播， p=>button=>div=>body..........事件冒泡可以形象地比喻为把一颗石头投入水中，泡泡会一直从水底冒出水面。
浅谈js的事件冒泡和事件捕获
原文地址：http://www.cnblogs.com/christineqing/p/7607113.html