JS Dom事件

Dom事件模型：就是指事件捕获和事件冒泡。

事件流：就是当用户点击触发了事件是怎样传递到压面上的过程就是事件流，事件流分为捕获、目标阶段、冒泡三个阶段，当用户点击按钮就是捕获阶段，事件通过捕获到达目标元素的时候就是目标阶段，冒泡阶段就是从目标阶段上传到window对象。

为什么没有Dom1级事件：因为Dom设计的时候没有设计到事件的部分，所以没有Dom1级事件。

Ele.addEventListener(‘click’,function(){},false)，在IE浏览器下是Ele.attachEvent(‘click’,function(){},false)。

Dom3级事件与Dom2一样，只是事件的类型增加了更多的键盘事件和鼠标事件。

事件捕获的具体流程：window->document->html->body->……->目标元素（获去html标签的方法是document.documentElement;）

Dom2级事件的第3个参数是一个布尔值，默认为false，也就是事件冒泡；第3个参数为true是，表示默认事件触发的是事件捕获。那么具体什么是事件冒泡和事件捕获呢？

首先我们给所有的盒子都添加上点击事件，当触发事件是弹出它自己的名字

刚开始我们的默认触发事件是事件冒泡，当我们点击son元素时会依次弹出son,parent,grandpa；如果我们点击的是parent元素会依次弹出parent,grandpa;当我们点击最外层的元素grandPa是只会弹出grandPa。这样当我们点击内层元素时，由当前元素依次向上传递的触发事件的效果，就像是湖底的气泡一样逐渐向上传递的过程称为事件冒泡。

现在我们改变触发事件的默认事件为事件捕获，只需要将Dom2级事件的第3个参数改为true即可。

现在当我们点击元素son时，会依次弹出字符串grandPa、parent、son，点击parent时会弹出grandpa、parent，点击grandpa是只会弹出grandpa。说名默认为事件捕获的情况下，事件的触发顺序是最先触发最外层的事件，由外向内依次触发。效果就像是由外向内依次捕获的一样。

有时默认事件也不一定会适用我们的使用场景，所以就需要清除事件冒泡，那么当我们点击内层元素的时候就不会触发它祖先元素的相同的监听事件了

需要在哪个元素上取消事件冒泡就添加以上标识的代码即可，同样如果需要取消事件捕获，也是添加这样的代码。

当我们阻止了事件冒泡，那么它的效果会变为，只有我们点击的那个元素的事件会被触发

阻止事件捕获后，的效果是，无论我们点击哪个元素，都只会触发最外层哪个元素的点击事件。