JavaScript中的事件冒泡是指事件从子元素传递到父元素的过程，可以帮助我们方便地处理多层嵌套元素的事件。下面我们来看一些冒泡相关的代码段。

一般情况下，事件会先从点击的元素向外传播，逐层向上找到最外层的父元素。我们比如有这样一个HTML结构：

<div id="outer">
<div id="inner">点击我</div>
</div>

当我们在内层的div上点击时，事件会经过inner和outer两个元素，如下代码：

document.getElementById("outer").addEventListener("click", function() {
console.log("outer clicked");
});
document.getElementById("inner").addEventListener("click", function() {
console.log("inner clicked");
});

如果你点了inner，浏览器控制台会先输出"inner clicked"，再输出"outer clicked"，因为事件从inner冒泡到了outer。

我们也可以通过一些技巧，控制事件的冒泡过程。比如，我们想让点击inner时只输出它自己的信息，可以通过stopPropagation()方法阻止事件继续冒泡。

document.getElementById("inner").addEventListener("click", function(event) {
console.log("inner clicked");
event.stopPropagation(); // 阻止事件向外进行冒泡
});

这样，无论你是在inner还是outer上点击，只会输出相应元素自己的信息。

除了stopPropagation()，还有另一个方法preventDefault()可供使用。它可以阻止事件的默认行为，比如在链接上点击时不跳转。

document.getElementById("link").addEventListener("click", function(event) {
event.preventDefault(); // 阻止链接的默认跳转行为
});

最后，我们也可以通过委托事件来优化代码。委托事件是指将事件绑定到父元素上，根据子元素的事件目标，分发事件到对应的处理函数中。

document.getElementById("list").addEventListener("click", function(event) {
if (event.target && event.target.nodeName === "LI") {
// 根据点击目标筛选处理函数
console.log(event.target.innerHTML);
}
});

这个例子中，我们在ul元素上绑定了click事件，任何在下面的li元素上触发的点击事件都会被统一处理。通过判断事件目标的节点类型，我们可以筛选出哪个li元素被点击。