jquery入门——事件机制之事件中的冒泡现象示例解释

1、当用户浏览页面时，浏览器会对页面代码进行解释或编译——这个过程实质上是通过事件来驱动的，即页面在加载时，执行一个Load事件，在这个事件中实现浏览器编译页面代码的过程。事件被触发后被分为两个阶段，一个是捕获（Capture），另一个是冒泡(Bubbing)，但大多浏览器并不是都支持捕获阶段，因此事件被触发后，往往执行冒泡过程。

2、示例代码：
复制代码 代码如下:
















3、效果图预览：

点击后：

点击一次后，显示执行的次数是3次，这是因为事件在执行过程中存在冒泡现象，即虽然单击的是按钮，但按钮外围的元素的事件也被触发，同时元素外围的元素的事件也被触发，整个过程为冒泡过程。如何阻止冒泡过程的发生，可以通过stopPropagation()方法或return false来实现，修改代码为：
复制代码 代码如下:


效果图如：

点击后