关于句柄

句柄即事件监听器，我也是在今天上午看到事件事件监听器，突然不知道这是什么才去查了下。

首先，在HTML中为一个元素添加事件，一般有三种：

1.通过HTML元素属性。简单说来就是在html结构中，给你要添加事件的元素添加一个属性。
属性名为 'on' + 事件名。
如:你要给a元素绑定一个click事件，你就该这么写：
<a href="http://blog.163.com/luping_01/blog/#" onclick='do something'>name</a>

 2.通过对象属性。
对象指的是jDOM树里的对象，我们都知道，所有的html元素在DOM(文档对象类型)里都存在一个相应的DOM元素。
给这个DOM元素添加事件等同于方式一。这个属性名也一样：
也为 on + 事件名
如：
html结构:
<a href="http://blog.163.com/luping_01/blog/#" id="n">name</a>
js：
document.getElementById('n').onclick = function(){ //do something}

3.通过W3C监听方式（标准方式）或者IE专属的中间模型添加事件

W3C方式： elemennt.addEventListener(事件名,处理函数引用,true || false)
这里的事件名就是单纯的事件名，不需要加 on ，true表示在事件传播阶段捕获事件，false表示在事件冒泡阶段捕获事件，一般我们设为false!

在这里所说的就是第三种：

addEventListener()添加句柄

方法用于向指定元素添加事件句柄

 

$(function () {
    var btn = $("button");
    for (var i in btn) {
        btn[i].addEventListener("click", function () {
            alert(this.innerHTML);
        }, true)
    }
})

 

在这里呢，是给所有button按钮添加了一个点击事件，当点击按钮时会弹出一个内容为按钮上内容的弹窗，addEventListener()方法一共有三个参数，第一个参数即事件名称，第二个参数是触发事件后所要给出的效果，最后一个则是判断在什么时候捕获事件。

 

RemoveEventlistener()移除方法添加的事件句柄，RemoveEventlistener()方法和addEventListener()方法用法参数一致

其次，有一个特例就是IE浏览器

在IE中，每个元素和window对象都有两个方法：attachEvent方法和detachEvent方法。这两个方法和以上两个方法在作用上是相同的。但是呢，在IE浏览器中事件前需要加上一个on，且第三个参数也非为必要【在其他浏览器中默认为false】，也就是说IE浏览器中添加事件与移除事件的方法只有两个参数即可。

【最后，因为看的并不是很仔细，可能多有错漏，还请多多指正】