DOM和事件

separator：字符串或正则表达式，从该参数指定的地方分割字符串。必须要填写 howmany：指返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果

没有设置该参数，整个字符串都会被分割，不考虑它的长度。可选

DOM和事件

事件流

一、什么是事件流：

我们点击一个按键，那么他是如何传递的呢，是从文档顶部一层层传入到这个按键，还是从这个按键传出去呢？

曾经在 IE 就是从里面往外（确定的逐步到不确定的），叫做事件冒泡而到了 Netscapte 就是从外面往里（不确定的逐步到确定的），叫做事件捕捉

最终在 W3C 的定义规范中，就把两者都包含了~~~（哈哈哈，谁都赢了，但谁也没赢）

所以现在在 DOM事件模型中会分为捕获和冒泡。一个事件发生后，会在子元素和父元素之间传播（propagation）。这种传播分成三个阶段。

1. 捕获阶段：事件从window对象自上而下向目标节点传播的阶段；
2. 目标阶段：真正的目标节点正在处理事件的阶段；
3. 冒泡阶段：事件从目标节点自下而上向window对象传播的阶段。

那么为什么会有事件捕获和事件冒泡呢这就涉及到事件委托

那么什么是事件委托呢，事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。

事件流描述从页面接收事件的顺序

事件发生时会在元素节点和根节点之间按照特定的顺序传播，路径所经过的节点都会收到该事件——DOM事件流。

两种事件流模型：

1.捕获：触发元素的事件时，该事件从该元素的祖先元素传递下去 (不太具体的节点应该更早接收到事件，而最具体的节点最后收到事件)

2.冒泡：到达此元素之后，又会向其祖先元素传播上去 DOM标准规定事件流包括3个阶段：事件捕获、处于目标阶段和事件冒泡

事件捕获：实现目标在捕获阶段不会接收事件处于目标阶：事件在

上发生并处理。但是事件处理会被看成是冒泡阶段的一部分冒泡阶段：事件又传播回文档

所有事件都要经过捕获阶段和处于目标阶段，但有些事件没有冒泡阶段。

如focus(获得输入焦点)和失去输入焦点的blur事件。无法进行委托

var btn = document.getElementById('.btn');

btn.onclick = fun;

绑定速度快

可能页面还未完全加载出来，事件可能无法正常运行

只支持冒泡，不支持捕获同一个类型的事件只能绑定一次

var btn = document.getElementById('.btn');

btn.onclick = fun2;

//出错后绑定的事件会覆盖掉之前的事件

删除 DOM0 级事件处理程序只要将对应事件属性置为null即可

btn.onclick = null;

标准事件模型

事件捕获：从document一直向下传播到目标元素, 依次检查经过的节点是否绑定了事件监听函数，如果有则执行

事件处理：到达目标元素, 触发目标元素的监听函数事件冒泡：从目标元素冒泡到document, 依次检查经过的节点是否绑定了事件监听函数，如果有则执行

事件绑定监听函数的方式如下:

addEventListener(eventType, handler, useCapture)

事件移除监听函数的方式如下:

removeEventListener(eventType, handler, useCapture)

eventType指定事件类型(不要加on)

handler是事件处理函数 useCapture是boolean类型用于指定是否在捕获阶段进行处理，一般设置为false与IE浏览器保持一致

举个例子：

var btn = document.getElementById('.btn');

btn.addEventListener(‘click’, showMessage, false);

btn.removeEventListener(‘click’, showMessage, false);

特性

可以在一个DOM元素上绑定多个事件处理器，不会冲突