事件

文档与浏览器窗口中发生的一些特定的交互瞬间。

事件冒泡

事件流：从页面中接收事件的顺序

IE的事件流叫做事件冒泡。事件从文档中嵌套层次最深的那个节点开始接收，逐渐向上传播到较为不具体的节点。

事件捕获

与事件冒泡相反。从最不具体的节点开始到最深处节点。

事件处理程序

HTML事件处理

<input type="text" onclick="test()" />

DOM0级事件处理程序

var btn = document.getElementById("test");
btn.onclick = function){

};

DOM2级事件处理程序

var btn = document.getElementById("test");
btn.addEventListener("click",test);

btn.removeEventListener("click",test);

addEventListener()

removeEventListener

都接受3个参数，要处理的事件名，作为事件处理程序的函数和一个布尔值。如果是true，表示在捕获阶段调用。否则表示在冒泡阶段调用。

IE事件处理

attachEvent()

detachEvent()

事件委托

利用事件冒泡，只指定一个时间处理程序，就可以管理某一类型的所有事件。

模拟事件

在document对象上使用createEvent()创建event.这个函数接收一个字符串参数。然后使用dispatchEvent()方法触发事件。

模拟鼠标事件

var btn = document.getElementById("myBtn");

//创建事件对象

var event = document.createEvent("MouseEvents");

//初始化事件对象

event.initMouseEvent("click",true,true,document.defaultView,0,0,0,0,0,false,false,false,false,0,null);

//触发事件

btn.dispatchEvent(event);

模拟键盘事件

var textbox = document.getElementById("mytextbox");

//以DOM3级方式创建事件对象

if(document.implementation.hasFeature("KeyboardEvents","3.0")){
  event = document.createEvent("KeyboardEvent");

  //初始化事件对象
  event.initKeyboardEvent("keydown",true,true,document.defaultView,"a",0,"shift",0);
}

//触发事件
textbox.dispatchEvent(event);