高程3总结#第13章事件

摘要：所有节点中都包含这两个方法，并且它们都接受个参数要处理的事件名，作为事件处理程序的函数和一个布尔值。和支持这个事件。

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

IE的事件流叫做事件冒泡，即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接收，然后逐级向上传播到较为不具体的节点

事件捕获的思想是不太具体的节点应该更早接收到事件，而最具体的节点应该最后接收到事件，事件捕获的用意在于在事件到达预定目标之前捕获它。

DOM2级事件规定的事件流包括三个阶段：事件捕获阶段，处于目标阶段和事件冒泡阶段

某个元素支持的每种事件都可以使用一个与相应事件处理程序同名的HTML特性来指定，这个特性的值应该是能够执行的JavaScript代码

每个元素，包括window和document都有自己的事件处理程序属性，这些属性通常全部小写

var btn=document.getElementById("myBtn");
btn.onclick=function(){
  alert("Clicked");
};

DOM2级事件定义了两个方法，用于处理指定和删除事件处理程序的操作，addEventListener()和removeEventListener()。所有DOM节点中都包含这两个方法，并且它们都接受3个参数：要处理的事件名，作为事件处理程序的函数和一个布尔值。最后这个布尔值参数如果是true，表示在捕获阶段调用事件处理程序，如果是false，表示在冒泡阶段调用事件处理程序

var btn=document.getElementById("myBtn");
btn.addEventListener("click",function()){
  alert(this.id);
},false);
btn.addEventListener("click",function(){
  alert("Hello world!");
},false)

通过addEventListener()添加的事件处理程序只能使用removeEventListener()来移除，移除时传入的参数与添加处理程序时使用的参数相同，这也意味着通过addEventListener()来添加的匿名函数将无法移除

IE实现了与DOM中蕾西的两个方法，attachEvent()和detachEvent()。这两个方法接收相同的两个参数，事件处理程序和事件处理程序函数

要保证处理事件的代码能在大多数浏览器下一致地运行，只需关注冒泡阶段

第一个要创建的方法是addHandler()，它的职责是视情况分别使用DOM0级方法，DOM2级方法或IE方法来添加时间，这个方法属于一个名叫EventUtil的对象。addHandler()方法接收3个参数：要操作的元素、事件名称和事件处理程序函数

与addHandler()对应的方法是removeHandler()它也接收相同的参数，这个方法的职责是移除之前添加的事件处理程序，无论事件处理程序时采取什么方式添加到元素中的，如果其他方法无效，默认采用DOM0级方法

兼容DOM的浏览器会将一个event对象传入到事件处理程序中，无论指定事件处理程序使用什么方法，都会传入event对象

DOM3级事件规定以下几类事件

UI事件，当用户与页面上的元素交互时触发

焦点事件，当元素获得或失去焦点时触发

鼠标事件，当用户通过鼠标在页面上执行操作时触发

滚轮事件，当使用鼠标滚轮时触发

文本事件，当在文档中输入文本时触发

键盘事件，当用户通过键盘在页面上执行操作时触发

合成事件，当为IME输入字符时触发

变动事件，当底层DOM结构发生变化时触发

变动名称事件，当元素或属性名变动时触发，已废弃

UI事件指的是那些不一定与用户操作有关的事件

DOMActivate，表示元素已经被用户操作，通过鼠标或键盘激活

load，当页面完全加载后在window上面触发，当所有的框架都加载完毕时在框架集上面触发，当图像加载完毕时在元素上触发，或者嵌入的内容加载完毕时在