在 JavaScript 中，事件冒泡和捕获是事件传播的两种机制。要控制这两种机制，你可以使用以下方法：
使用 addEventListener 方法的第三个参数：
当使用 addEventListener 方法为元素添加事件监听器时，可以传递一个可选的第三个参数。这个参数决定了事件触发时，监听器的执行顺序。取值如下：
false（默认值）：事件触发时，监听器按照它们被添加的顺序执行，即事件冒泡阶段先执行捕获阶段的监听器，然后执行目标元素上的监听器，最后执行冒泡阶段的监听器。true：事件触发时，监听器按照它们被添加的逆序执行，即事件冒泡阶段先执行目标元素上的监听器，然后执行捕获阶段的监听器，最后执行冒泡阶段的监听器。示例：
const button = document.querySelector('button');
const parent = button.parentElement;
function bubbleHandler() {
console.log('Bubble handler');
}
function captureHandler() {
console.log('Capture handler');
}
parent.addEventListener('click', bubbleHandler, false); // 事件冒泡阶段执行
parent.addEventListener('click', captureHandler, true); // 事件捕获阶段执行
使用 Event 对象的 stopPropagation 方法：
当事件触发时，你可以使用 stopPropagation 方法阻止事件继续传播。这样，事件就不会触发冒泡或捕获阶段的监听器。
示例：
const button = document.querySelector('button');
const parent = button.parentElement;
function bubbleHandler() {
console.log('Bubble handler');
}
function captureHandler() {
console.log('Capture handler');
}
parent.addEventListener('click', bubbleHandler);
parent.addEventListener('click', captureHandler);
button.addEventListener('click', (event) => {
event.stopPropagation(); // 阻止事件冒泡
});
通过合理地设置第三个参数和调用 stopPropagation 方法，你可以根据需要控制事件冒泡和捕获的执行顺序。
