Javascript 为什么在我发送事件时会立即触发它？

我想在单击元素

#b

时执行一些操作，然后在

handleB（）完成之前调度另一个事件侦听器

当我被单击
#b
时，事件
单击
#a
已成功调度，并且它也已触发，但我不想触发它

这是怎么回事


document.getElementById（'b'）。addEventListener（'click'，handleB）
功能手柄（）{
警报（'Handle B！'）；
document.getElementById（'a'）。addEventListener（'click'，handleA）
}

AAA
BBB
发生这种情况的原因是#b冒泡到#a的事件，以及您在把手内添加了单击事件侦听器。它会立即触发#b事件。你必须阻止这件事发生。以下是工作示例：


document.getElementById（'b'）。addEventListener（'click'，handleB）；
功能把手（活动）{
event.stopPropagation（）；
console.log（'b clicked'）；
document.getElementById（'a'）。addEventListener（'click'，handleA）
}
函数handleA（）{
log（'a clicked'）；
}
#a{
宽度：200px；
高度：200px；
背景色：红色；
}
#b{
宽度：100px；
高度：100px；
背景颜色：绿色；
}

事件冒泡到
a
元素？您没有
handleA
功能？停止事件冒泡：大多数事件冒泡到DOM树，因此
a
元素也会收到单击
b
的命令。由于您在
b
中添加了一个单击处理程序，它会立即被触发。使用
event.stopPropagation（）
inside
handleB
以阻止单击继续向上移动DOM树。它是向右冒泡的，但我很困惑，因为JS是一个异步程序，所以当我触发#b`单击按钮时