DOM事件流+阻止冒泡事件+dom包含

DOM(文档对象模型)结构是一个树型结构，当一个HTML元素产生一个事件时，该事件会在元素节点与根结点之间的路径传播，路径所经过的结点都会收到该事件，这个传播过程可称为DOM事件流。DOM事件流最独特的性质是，文本节点也触发事件（在IE中不会），当鼠标单击“单击此文本”文本时会触发click事件，该事件的捕获阶段最先开始，从Document节点开始逐渐向下传播，直到“单击此文本”文本节点，事件进入目标阶段，在目标阶段结束之后，事件由“单击此文本”文本节点开始事件的冒泡阶段，直到Document节点为止。
简单来说事件流描述的就是页面中接受事件的顺序。

DOM事件流的三个阶段：
（1）事件捕获阶段：事件从Document节点自上而下向目标节点传播的阶段；
（2）事件目标阶段：真正的目标节点正在处理事件的阶段；
（3）事件冒泡阶段：事件从目标节点自下而上向Document节点传播的阶段。

事件冒泡是一个从子节点向祖先节点冒泡的过程；
事件捕获刚好相反，是从祖先节点到子节点的过程。

event.stopPropagation()方法阻止事件冒泡到父元素，阻止任何父事件处理程序被执行
event.preventDefault()方法取消事件的默认动作。该方法将通知 Web 浏览器不要执行与事件关联的默认动作（如果存在这样的动作）。
例如：
form表单如果 type 属性是 “submit”，通过调用该方法，可以阻止提交表单。a元素中href连接，如果调用此方法是，连接不会被打开。
使用该方法还是会发生冒泡事件，冒泡会传递到上一层的父元素。
1
2
3
4
5
6
7
8

事件代理是利用事件冒泡行为，简单说就是：事件不直接绑定到某元素上，而是绑定到该元素的父元素上，如列表，再执行事件触发后的语句。 好处：(1)使代码更简洁；(2)节省内存开销

dom包含哪些？
1.元素节点
元素节点element对应网页的HTML标签元素。
2.属性 / 特性节点
元素特性节点attribute对应网页中HTML标签的属性。
3.文本节点
文本节点text代表网页中的HTML标签内容。
4.文档节点
文档节点document表示HTML文档，也称为根节点，指向document对象。