为元素绑定多个事件
在之前的练习中当注册点击事件时都使用：
xx.onclick = function(){
xx
};
的方式，但是当出现一个对象注册了多个onclick事件，并由不同的js文件导入时，一旦点击，就会发生冲突，多个点击事件只会触发最后一个，这个时候需要为元素绑定多个事件了。
为元素绑定事件（DOM）有两种方法：
1.对象.addEventListener("事件类型", 事件处理函数, false)--谷歌&火狐支持，IE8不支持
为按钮绑定点击事件：
参数1：事件的类型----事件的名字，没有on。
参数2：事件的处理函数----函数（命名函数，匿名函数）
参数3：布尔类型，目前固定写死为false
示例（为同一个元素绑定多个事件）：
<input type="button" value="按钮" id="btn"/>
<script>
my$("btn").addEventListener("click",function () {
console.log("The violent delights have violent ends.");
},false);
my$("btn").addEventListener("click",function () {
console.log("The violent delights have violent ends.");
},false);
my$("btn").addEventListener("click",function () {
console.log("The violent delights have violent ends.");
},false);
my$("btn").addEventListener("click",function () {
console.log("The violent delights have violent ends.");
},false);
</script>
效果：
2.对象.attachEvent("有on的事件类型", 事件处理函数)--谷歌&火狐不支持，IE8支持
参数1：事件类型----事件名字， 有on参数2：事件处理函数----函数（命名函数，匿名函数）
示例：
<input type="button" value="按钮" id="btn"/>
<script>
my$("btn").attachEvent("onclick",function () {
console.log("我是谁1")
});
my$("btn").attachEvent("onclick",function () {
console.log("我是谁2")
});
my$("btn").attachEvent("onclick",function () {
console.log("我是谁3")
});
my$("btn").attachEvent("onclick",function () {
console.log("我是谁4")
});
</script>
到IE11又不支持这个方法了，由于电脑装的是IE11，只能放弃这个尝试了，我也真是醉了。
3.为元素绑定事件的兼容代码
可以以对象.事件来判断事件是否兼容，书写兼容函数如下：
<input type="button" value="按钮" id="btn"/>
<script>
function addEventLi(element, type, fn) {
if (element.addEventListener){//为true则代表该方法在该浏览器可用
console.log("1");
element.addEventListener(type, fn, false);
}else if (element.attachEvent){
console.log("2");
element.attachEvent("on"+type, fn);
}else{
console.log("3");
element["on"+type] = fn;
}
}
addEventLi(my$("btn"), "click", function () {
console.log("你好");
});
addEventLi(my$("btn"), "click", function () {
console.log("我好");
});
addEventLi(my$("btn"), "click", function () {
console.log("大家好");
});
</script>
效果：
将该代码加入common.js中