说说事件
可以说，网页跟事件是分不开的。事件是一件太平常的事情，让很多人很多时候会忽略它的存在。然而我们还是很有必要了解一下事件。
事件就是用户或浏览器自身执行的某种动作。比如常见的click,load和mouseover，都是事件。相应某个事件的函数叫做事件处理程序，也叫事件监听器。事件监听器以on开头，如常见的onclick。
监听事件
监听事件的方法有多种：
HTML事件监听器
也就是常见的HTML内联属性的写法。即用与相应事件监听器同名的html特性来指定监听事件。
<div onclick="alert('Clicked')">
值得注意的是，事件监听器中的代码再执行时，有权访问全局作用域中的任何代码，所以在onclick里，我们可以使用定义在全局作用域中的JavaScript函数。
还有，我们可以通过event变量，访问到事件对象，而不用定义它。
<input type="button" value="Click Me" onclick="alert(event.type)">
而，在html中指定事件监听器有几个缺点：
- 时差问题。考虑一种情况：在我们触发某个事件时，可能事件处理程序中尚不具备执行条件，如用到的函数还未被解析。
- 耦合问题。这样的写法，html和JavaScript代码耦合了，需要修改时，也许需要修改多个地方。
DOM属性绑定
即将一个函数赋值给一个事件处理程序属性。
例子：
var btn = document.getElementById("myBtn");
btn.onclick = function(){
alert("Clicked");
};
首先我们要取得对象的引用，然后才可以为它指定事件处理程序。
通过将事件处理程序属性的值设置为null可以删除事件处理程序。
通过addEventListener()和removeEventListener()
el.addEventListener(eventName,callback,flag)
所有的DOM节点都包含这两个方法，它有三个参数，分别是要处理的事件名，作为事件处理程序的函数，和一个布尔值（true和false分别表示在捕获阶段和冒泡阶段调用事件处理程序，默认是false）。
var btn = document.getElementsByTagName('button');
btn[0].addEventListener('click', function() {
alert('Clicked');
}, false);
值得注意的是，这种方法可以添加多个事件处理程序。通过这种方式添加的事件处理程序也只能通过removeEventListener()来去掉。特殊的是，如果我们指定事件处理程序时用的是匿名函数，将无法去除这个事件处理程序。
