如何取消事件冒泡
什么是事件冒泡?我们先看下面一段代码
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/e5b121cf4764d844903f33710f70676e.png)
当我点击按钮的时候,弹出框会弹出两次,一次是oBtn被点击,一次是document被点击,因为当你点击这个按钮的时候,同时也在点击整个document,这个就是事件冒泡。
但是在有些时候,比如我需要给document和oBtn分别添加不同的点击事件的时候,这个事件冒泡的存在就相当的多余了,那么我们如何去除它呢?
这个时候就需要用到cancelBubble了,这个单词很好记,cancel是取消的意思,Bubble是气泡的意思,合起来就是取消冒泡了,像图中这样加个cancelBubble就行了。![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/f5b409c48bdd60a09573c83d09c59a67.png)