一、on事件
为dom节点添加多个on事件只会执行最后的那个事件，因为最后的指定的on事件指向最后的那个函数，代码如下所示：
function method1(){console.log('我是方法1')}function method2(){console.log('我是方法2')}function method3(){console.log('我是方法3')}var button = document.getElementById("btn");button.onclick=method1;button.onclick=method3;button.onclick=method2;
这种写法只会执行method2函数，并输出'我是方法2'
二、addEvent事件监听
addEvent事件监听可以为DOM节点绑定多个事件，且允许出现相同事件。
addevent(type,listener[,options])函数可以传递三个参数：
type表示监听事件类型的字符串（注意不用on开头）
listener当所监听的事件类型触发时，会接收到一个事件通知对象（回调函数）
options（可选）值为Boolean类型，如果值为false(默认值)，事件触发机制就会按照冒泡(从下往上)，如果值为true，就会按照事件捕获，从上往下。
button.addEventListener("click", method1, false);button.addEventListener("click", method3, false);button.addEventListener("click", method2, false);//[输出结果]我是方法1我是方法3我是方法2
需要注意的是监听事件分为addEventListener和attachEvent函数，分别用在不同的浏览器和不同的版本。
三、事件监听案例
3.1 JavaScript代码
var button = document.getElementById("btn"),addBtn = document.getElementById("addBtn"),removeBtn = document.getElementById("removeBtn");addBtn.onclick = function() {addMethod(button, 'click', say)}removeBtn.onclick = function() {removeMethod(button, 'click', say)}//[绑定监听事件]function addMethod(node, type, method) {if (node.addEventListener) { // IE9以下不兼容node.addEventListener(type, method, false)} else if (node.attachEvent) { // IE独有node.attachEvent(`on${type}`, method)} else {node[`on${type}`] = method; // 一个元素只能绑定一个处理程序}}//[移除监听事件]function removeMethod(node, type, method) {if (node.removeEventListener) { // IE9以下不兼容node.removeEventListener(type, method, false)} else if (node.detachEvent) { // IE独有node.detachEvent(`on${type}`, method)} else {node[`on${type}`] = null;}}function say() {console.log("Hello World!")}
3.2 效果展示
