事件冒泡与捕获

相信很多对javascript 不熟悉的人 ，对这两个概念很陌生，不知道是什么东西。

但我们用js写的没一句代码都离不开他，也就是它们一直是存在的 只是我们不知道而已。

首先事件我们都知道是什么意思，说白了就是用户的操作，比如 click mouseover 之类的，这叫做事件。

比如有个按钮 我们点击它之后，你以为你只是点击了这个按钮吗? 不是的，浏览器可能还认为你不光点了按钮  还点击了按钮所在的容器

甚至于整个html，但是他会匹配一个最具体的元素，从它开始 按DOM结构将这个单击事件向上传递，直到最顶端的document对象 (也有浏览器是window对象)，

由于这个过程很像气泡一样逐渐向上升 所以就叫事件冒泡。

ok，事件冒泡至最顶端后冒泡事件就消失了，你不能只上去不下来啊  对吧。dom收到事件在原路传下来 这个过程叫捕获。你可以理解为是这个事件跑了一个来回趟。

可能还会有这样的可能，我点击了一个按钮 ，我只想让这个事件只在这个按钮上有效，不要他往上走了。这时候我们就可以阻止冒泡了

javascript提供了stopPropagation()方法 来阻止事件冒泡。用当前事件来调用 event.stopPropagation();

当然你也可以return false 这样连你自身的事件也阻止了。

阻止事件冒泡的用途一半是 怕某些元素的事件会影响到其他的事件。

举一个很形象的例子，比如你做了一个事件，就相当于你上诉了一个案子，先是向镇级反应，镇里不处理，继续向县级反应，又不处理，市里，省里，只至党中央,这是事件冒泡

党中央你不能再不管了吧，党中央处理完了，你得给个结果啊，然后这个结果在沿着省里 市里 县里 镇里 这样一级一级的下来 直到你手里，这是事件捕获。

如果在县里的时候 县里给你处理了 那你还需要往上反应吗，这时候就不需要了。也就是阻止冒泡了。

早期版本的的ie浏览器 和netpace 对冒泡的执行是相反顺序来的，是先从最上层开始 向下找。找到了然后冒泡上来,就像你往河里扔了块石头，先沉下去在冒个泡上来。

不过这种机制已经被淘汰了。

以上纯属个人理解，如有错漏，还请指正！

 

转载于:https://www.cnblogs.com/Running-cqw/p/4159439.html