一直想写一个原生事件监听的记录，方便以后看，不愿意写主要是事件监听的单词太长，记起来好难记每次都要查，这次把知道的写完了，来这里查好了，以后要是理解的更透彻了，就再补全好了
首先，DOM0级事件和DOM2级事件
给一个元素添加事件有三种方法
HTML
<input type="button" value='button1' id='btn1' />
<input type="button" value='button2' id='btn2' />
<input type="button" value='button3' id='btn3' onclick="alert('我是btn3')" />
对于btn3的按钮，事件是直接加到元素标签内的，好像叫html事件，缺点就是没有分离吧
DOM0级事件
//添加事件
var btn1=document.getElementById('btn1');
btn1.onclick=function(){
alert('我是btn1')
}
//解除事件
btn1.onclick=null;
直接取到btn1，给他添加conclick事件，缺点只能添加一个事件，如果再添加，会覆盖第一个事件
DOM2级事件
//添加事件
var btn2=document.getElementById('btn2');
function box(){alert('我是btn2');}
btn2.addEventListener('click',box,false);
//解除事件
btn2.removeEventListener('click',box,false);
添加事件用 addEventListener(什么事件、做什么事、false); false好像是事件冒泡阶段 对应的 true事件捕获阶段，一般我这种菜鸟用不到true，没试过，反正一律写false
删除事件用 removeEventListener(什么事件、做什么事、false);
ps:添加事件和删除事件，必须和添加的时候相同才能移除，不然清不掉。
好像挺简单，真的要是这样就好了，这个addEventListener和removeEventListener有兼容问题，好像是IE8以下不好使，所以还有另外的单词要记
attachEvent 和 detachEvent，这个好像是IE专属，
用法
//添加事件
var btn2=document.getElementById('btn2');
function box(){alert('我是btn2');}
btn2.attachEvent('onclick',box);
//解除事件
btn2.detachEvent('onclick',box);
没有第三个参数是因为IE8以前只支持事件冒泡，另外需要记住，这里是onclick，所有的事件都要加on，低级的浏览器事比较多
好了，要记住这四个单词
addEventListener、removeEventListener、attachEvent、detachEvent
------------------------------------------------------------------------------------分割线------------------------------------------------------------------------------------------------------------------
要兼容所有浏览器，就做判断，谁有能力，谁做事
var btn2=document.getElementById('btn2');
function box(){alert('我是btn2');}
var eventUtil={
// 添加事件
addHandler:function(element,type,handler){ ////三个参数分别为元素、事件、做什么事(方法)
if(element.addEventListener){ //如果支持element.addEventListener方法就用addEventListener
element.addEventListener(type,handler,false);
}else if(element.attachEvent){ //如果支持element.attachEvent方法就用attachEvent
element.attachEvent('on'+type,handler);
}else{
element['on'+type]=handler; //如果都不支持，那就用DOM0级的方法
}
},
// 删除事件 //同上
removeHandler:function(element,type,handler){
if(element.removeEventListener){
element.removeEventListener(type,handler,false);
}else if(element.detachEvent){
element.detachEvent('on'+type,handler);
}else{
element['on'+type]=null;
}
}
}
eventUtil.addHandler(btn2,'click',box);
eventUtil.removeHandler(btn2,'click',box);
封装了一个方法，以后可以直接拿过来用