1.冒泡机制
（1）冒泡机制：
点击span之后的冒泡顺序是：
span
div
body
之所以称为冒泡，是因为事件会按照DOM的层次结构像水泡一样不断向上直至顶端。
（2）冒泡机制引发的问题：
事件冒泡可能会引起预料之外的效果。上例中，本来只想触发<span>元素的click事件，然而<div>元素和<body>元素的click事件也同时被触发了。
（3）停止冒泡机制：
停止事件冒泡可以阻止事件中其他对象的事件处理函数被执行。在JQuery中提供了stopPropagation()方法来停止事件冒泡。
（4）事件委托机制：
基于事件冒泡机制，事件委托就是事件目标自身不处理事件，而是把处理任务委托给其父元素或者祖先元素，甚至根元素（document）。
2.live绑定事件的实现原理
所有的事件不是绑定而是委托。
$(".clickMe").live("click",fn);
$("body").append("<div class='clickMe'>测试live方法的步骤</div>");
当我们点击这个新增的元素时会依次发生如下步骤：
（1）生成一个click事件，传递给div来做处理
（2）由于没有事件直接绑定在div上，所以事件直接冒泡到DOM树上
（3）事件不断冒泡，直到DOM树的根节点上，默认情况下，根节点上就绑定了这个click事件
（4）执行由live绑定的click事件
（5）检测绑定事件的对象是否存在，判断是否需要继续执行绑定的事件。检测事件对象是通过检测
$(event.target).closest('.clickMe') 能否找到匹配的元素来实现的。
（6）通过（5）的测试，如果绑定事件的对象存在的话，就执行绑定的事件。
live绑定事件的不足之处
使用live当然有利也有弊：
好处就是：元素更新时不用反复去定义事件。
坏处就是：把事件绑定在document上会在页面上每一个元素都呼叫一次，如使用不当会严重影响性能。
（1）冒泡机制：
<html>
<div id="content">
<span>内层span元素</span>
</div>
</html>
点击span之后的冒泡顺序是：
span
div
body
之所以称为冒泡，是因为事件会按照DOM的层次结构像水泡一样不断向上直至顶端。
（2）冒泡机制引发的问题：
事件冒泡可能会引起预料之外的效果。上例中，本来只想触发<span>元素的click事件，然而<div>元素和<body>元素的click事件也同时被触发了。
（3）停止冒泡机制：
停止事件冒泡可以阻止事件中其他对象的事件处理函数被执行。在JQuery中提供了stopPropagation()方法来停止事件冒泡。
（4）事件委托机制：
基于事件冒泡机制，事件委托就是事件目标自身不处理事件，而是把处理任务委托给其父元素或者祖先元素，甚至根元素（document）。
2.live绑定事件的实现原理
所有的事件不是绑定而是委托。
$(".clickMe").live("click",fn);
$("body").append("<div class='clickMe'>测试live方法的步骤</div>");
当我们点击这个新增的元素时会依次发生如下步骤：
（1）生成一个click事件，传递给div来做处理
（2）由于没有事件直接绑定在div上，所以事件直接冒泡到DOM树上
（3）事件不断冒泡，直到DOM树的根节点上，默认情况下，根节点上就绑定了这个click事件
（4）执行由live绑定的click事件
（5）检测绑定事件的对象是否存在，判断是否需要继续执行绑定的事件。检测事件对象是通过检测
$(event.target).closest('.clickMe') 能否找到匹配的元素来实现的。
（6）通过（5）的测试，如果绑定事件的对象存在的话，就执行绑定的事件。
live绑定事件的不足之处
使用live当然有利也有弊：
好处就是：元素更新时不用反复去定义事件。
坏处就是：把事件绑定在document上会在页面上每一个元素都呼叫一次，如使用不当会严重影响性能。
798
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
