方式一：对象.事件=函数
使用对象.事件=函数的形式绑定响应函数
它只能同时为一个元素的一个事件绑定一个响应函数，不能绑定多个，如果绑定了多个，则后边会覆盖掉前边的
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button id="btn01">点我一下</button>
</body>
<script>
//单击按钮后弹出内容
var btn01=document.getElementById("btn01");
btn01.onclick=function(){
alert(1);
};
btn01.onclick=function(){
alert(2);
};
</script>
</html>
只会弹出2，不会弹出1
方式二：addEventListener()方法
参数:
1.事件的字符串，不要on
2.回调函数，当事件触发时该函数会被调用
3.是否在捕获阡段触发事件，需要一个布尔值，一般都传falsel
为上面btn01绑定两个单击响应函数：
btn01.addEventListener("click",function(){
alert(1);
},false);
btn01.addEventListener("click",function(){
alert(2);
},false);
先弹出1，再弹出2
这个方法不支持IE8及以下的浏览器
方式三：IE5.0-10的浏览器可使用attachEvent()方法
参数：
1.事件的字符串，要on
2.回调函数
这个方法也可以同时为一个事件绑定多个处理函数，
不同的是它是后绑定先执行，执行顺序和addEventListener()相反
例如：
btn01.attachEvent("onclick",function(){
alert(1);
});
btn01.attachEvent("onclick",function(){
alert(2);
});
先弹出2，再弹出1
定义一个函数，用来为指定元素绑定响应函数
addEventListener()中的this，是绑定事件的对象
attachEvent( )中的this，是window
需要统一两个方法this
参数:
obj 要绑定事件的对象
eventStr 事件的字符串
callback 回调函数
function bind(obj,evenStr,callback){
if(obj.addEventListener){
//大部分浏览器兼容的方式
obj.addEventListener(evenStr,callback,false);
}else{
//通过callback.call(obj) 可改变this的调用方式
//IE8及以下浏览器
obj.attachEvent("on"+evenStr,function(){
//在匿名函数中调用回调函数
callback.call(obj);
});
}
}
bind(btn01,"click",function(){
//alert(1);
alert(this);
});
