Javascript之跨浏览器的事件处理程序

<span style="font-family: Arial, Helvetica, sans-serif;">HTML:</span>

<span style="font-family: Arial, Helvetica, sans-serif;">
</span>

<span style="font-family: Arial, Helvetica, sans-serif;"><input type="button" id="btn" value="点击我"/></span>

JS:

/**
		为了以跨浏览器的方式处理事件，很多前端开发人员使用能够隔离浏览器差异的Javascript库，还有一些开发人员会自己开发最合适的事件处理方法。当然，自己编写代码其实并不难，只要恰当地使用能力检测
		即可。要保证处理事件的代码能够在大多数浏览器下一致地运行，只需关注冒泡阶段。
		**/
		/**
		正题：
		第一个要创建的方法是addHandler(),它的职责是视情况分别使用DOM0级方法、DOM2级方法或IE方法来
		添加事件。这个方法我规定隶属于一个名叫EventUtil的对象，我会使用这个对象来处理浏览器的差异。
		addHandler()方法接受三个参数：要操作的元素、事件名称和事件处理程序函数；
		当然，与addHandler()对应的方法是removeHandler()，它接受形同的参数。这个方法的职责是移除之前
		添加的事件处理程序无论该事件处理程序是采用什么方式添加到元素中的，如果其他方法无效，
		默认会采用DOM0级方法。
		**/
		var EventUtil = {
			addHandler:function(element,type,handler){
				if(element.addEventListener){
					element.addEventListener(type,handler,false);
				}else if(element.attachEvent){
					element.attachEvent('on'+type,handler);
				}else{
					element['on'+type]=handler;
				}
			},
			removeHander:function(element,type,handler){
				if(element.removeEventListener){
					element.removeEventListener(type,handler,false);
				}else if(element.detachEvent){
					element.detachEvent('on'+type,handler);
				}else{
					element['on'+type]=null;
				}
			}
		
		
		}
		 
		 //
		 var btn=document.getElementById('btn');
		 var handler=function(){
		 	alert('我被点击了！')
		 }
		 EventUtil.addHandler(btn,'click',handler);  // 添加事件
		 
		 EventUtil.removeHander(btn,'click',handler);// 移除事件