<body> <div> <span id="a">点击</span> <a href="#" id="b">超链接</a> <button id="d" onclick="remove()">点击移除事件绑定</button> <button onclick="add()">点击添加事件绑定</button> </div> <script> var eventTool = { //获取事件 window.event兼容ie getEvent: function (e) { return e || window.event }, //获取事件触发元素 srcElement ie独有 getTarget: function (e) { return e.target || e.srcElement }, addListener: function (e, type, hander) { if (e.addEventListener) { //兼容ie ie没有事件捕获的说法 因此设为false //dom2e.addEventListener(type, hander, false); } else if (e.attachEvent) { //IE e.attachEvent('on' + type, hander) } else { //dom0 e['on' + type] = hander } }, removeListener: function (e, type, hander) { if (e.removeEventListener) { e.removeEventListener(type, hander, false) } else if (e.detachEvent) { e.detachEvent('on' + type, hander) } else { e['on' + type] = null } }, //阻止事件冒泡 stopPropagation: function (e) { if (e.stopPropagation) { // ie以外阻止冒泡 e.stopPropagation() } else { //ie独有阻止冒泡 新版本的chrome等浏览器也支持 e.cancelBubble = true } }, // 阻止事件相关元素的默认事件 preventDefault: function (e) { if (e.preventDefault) { e.preventDefault() } else { //ie的阻止默认事件方式 e.returnValue = false; } } } var btn = document.getElementById('a'); var link = document.getElementById('b'); var fun = function (e) { var e = eventTool.getEvent(e); var t = eventTool.getTarget(e); console.log(e) console.log(t) eventTool.stopPropagation(e) } var add = function () { eventTool.addListener(btn, 'click', fun) eventTool.addListener(link, 'click', fun) } var remove = function () { console.log(btn) eventTool.removeListener(btn, 'click', fun) } </script></body>
