标签：
1 var eventUill = { 2 //添加事件 3 addHander: function(element, type, handler) { 4 if(element.addEventListener) { 5 element.addEventListener(type, handler, false); 6 } else if(element.attachEvent) { 7 element.attachEvent(‘on‘ + type, handler); 8 } else { 9 element[‘on‘ + type] = handler; 10 } 11 }, 12 //移除事件 13 removeHander: function(element, type, handler) { 14 if(element.removeEventListener) { 15 element.removeEventListener(type, handler, false); 16 } else if(element.detachEvent) { 17 element.detachEvent(‘on‘ + type, handler); 18 } else { 19 element[‘on‘ + type] = handler; 20 } 21 }, 22 //获取到拥有这个事件的标签名称——事件对象（如input） 23 getEvent: function(event){ 24 return event?event:window.event;//注意：返回后需要调用。可配合nodeName，来单独获取到标签的名字。 25 }, 26 //获取事件的类型 27 getType: function(event){ 28 return event.type;//注意：返回后需要调用。 29 }, 30 //获取事件来自于哪个元素 31 getElement: function(event){ 32 return event.target || event.srcElement; 33 }, 34 //阻止、取消事件的默认行为/属性发生 35 preventDefault: function(event){ 36 if(event.preventDefault){ 37 event.preventDefault(); 38 }else{ 39 event.returnValue = null; 40 } 41 }, 42 //阻止冒泡行为 43 stopPropagation: function(event){ 44 if(event.stopPropagation){ 45 event.stopPropagation(); 46 }else{ 47 event.cancelBubble = true; 48 } 49 } 50 51 52 53 54 }
遇到的小bug总结：
以下是测试时的html文件，DOM2级事件-跨浏览器处理.js就是上面的js源码。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>dom2级事件跨浏览器处理-封装库</title> <script src="DOM2级事件-跨浏览器处理.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> window.onload = function() { var btn = document.getElementById(‘btn‘); eventUill.addHander(btn, ‘click‘, function() { alert(‘点击后通过封装的库辗转调用了这个匿名函数‘); alert(eventUill.getEvent(btn).nodeName); alert(eventUill.getElement(btn)); }); } </script> </head> <body> <input type="button" value="点击" id="btn" /> </body> </html>
标签：
原文地址：http://www.cnblogs.com/padding1015/p/5890679.html
