JavaScript中的事件机制是网页开发过程中不可避免的话题。事件冒泡是最常见的事件机制之一，由子元素向父元素一次次传递触发某个事件。但是，有时候我们需要阻止事件冒泡，防止它们影响到其他元素。在本文中，我们将会了解如何避免事件冒泡，以及JavaScript中的cancelBubble方法。

一、什么是事件冒泡

在JavaScript中，事件传递分为两种机制：冒泡和捕捉。在事件冒泡中，事件从父元素开始，向子元素传递。举个例子，假设有以下 HTML 代码：

```html