一、DOM事件模型
DOM 事件模型属于W3C标准模型，现代浏览器都支持该模型。在该事件模型中，一次事件共有三个过程：
-
事件捕获阶段（Capturing Phase）：事件从
document一直向下传播到目标元素，依次检查经历过的节点是否绑定了事处监听函数（事件处理程序），如果有则执行，反之不执行 -
事件处理阶段（Target Phase）：事件到达目标元素，触发目标元素的监听函数
-
事件冒泡阶段（Bubbling Phase）：事件从目标元素冒泡到
document，依次检查经过的节点是否绑定了事件监听函数，如果有则执行，反之不执行。
事件绑定API
以下为W3C制定的事件绑定方式：
target.addEventListener(type, fn, bool);
type ：表示监听事件类型的字符串。
fn ：为事件绑定的函数
bool ：当bool不传，或为falsy值时，就会在冒泡阶段执行fn的监听函数，并提供事件信息； 当bool为true时，就会在捕获阶段调用fn
取消冒泡
取消冒泡，所有冒泡都可取消，event.stopPropagation() 即可中断冒泡。
二、事件委托
如果你面临一个场景，为每一个超链接都绑定一个单击响应函数；
如果链接数目比较少，事情还好办，但如果有100个链接需要绑定呢？
这种操作比较麻烦， 而且这些操作只能为已有的超链接设置事件，而新添加的超链接需要重新绑定。
事件的委派
指将事件同意绑定给元素的祖先元素，这样当后代元素上的事件触发时，会一直冒泡到祖先元素，从而通过祖先元素的响应函数来处理事件 ；事件委派是利用了冒泡，通过委派可以减少事件的绑定次数，提高程序性能。
// 为ul绑定一个单击响应函数
u1.onclick = function(event) {
event = event || window.event
// 如果触发事件的对象是我们期望的元素则执行，否则不执行
if (event.target.className == "link") {
alert("我是ul的单击响应函数")
}
}
我们也可以将事件委托封装成函数，使用更加方便。
——— 部分内容来自饥人谷、www.w3cplus.com/javascript/…
