一、元素事件的绑定

1. 第一种方式

   /**
   *  @param {*} element 元素
   *  @param {*} type    事件类型* @param {*} fn      事件处理函数
   */
   element["on"+type]=fn;例如：element.onclick = function(){console.log("我是element元素的点击事件");  }

2. 第二种方式

   /*** 为任意元素绑定任意事件* @param {*} element 元素* @param {*} type    事件类型* @param {*} fn      事件处理函数*/
   element.addEventListener(type,fn,false);
   例如：element.addEventListener('click',function(){console.log("我是element元素的点击事件");},false);

3. 第三种方式

   /*** 为任意元素绑定任意事件* @param {*} element 元素* @param {*} type    事件类型* @param {*} fn      事件处理函数*/
   element.attachEvent(type,fn);
   例如：element.attachEvent('onclick',function(){console.log("我是element元素的点击事件");});

   　　　

二、元素事件的解绑

1. 第一种事件绑定方式的解绑

   /*** 为元素解绑事件* @param {*} element 标签元素* @param {*} type 事件类型*/
   element["on"+type] = null;
   例如：
   element.onclick = null; 　

2. 第二种事件绑定方式的解绑

   /*** 为元素绑定事件* @param {*} element 元素* @param {*} type    事件类型* @param {*} fn      事件处理函数*/
   element.removeEventListener(type,fn,false);
   例如：element.removeEventListener("click",function(){console.log("我是第二种事件绑定方式的解绑");},false);　　

3. 第三中事件绑定方式的解绑

   /*** 为元素解绑事件* @param {*} element 元素* @param {*} type    事件类型* @param {*} fn      事件处理函数*/
   element.detachEvent(type,fn);
   例如：
   element.detachEvent("onclick",function(){console.log("我是第三种事件绑定方式的解绑事件");
   });

　　注意：

1. 用什么方式绑定事件，就用什么方式解绑事件；
2. element.removeEventListener(type,fn,false) ====> element.addEventListener(type,fn,false)
   fn必须是命名函数，不能是匿名函数
   IE8不支持
   type是没有on的事件类型
   第三个参数是用来控制事件阶段的，false代表是冒泡阶段，true代表是捕获阶段
3. element.detachEvent(type,fn) ====> element.attachEvent(type,fn)

   fn必须是命名函数，不能是匿名函数

   谷歌火狐不支持，IE8支持

   type是有on的事件类型　

三、绑定事件的区别