javascript 给DOM绑定事件方法的3种写法

二话不说上代码：

var Event = {};
//方法一 runtime
Event.addEventListener = function(obj, eventType, listener){
	if(typeof window.addEventListener === 'function') {//DOM2接口
		el.addEventListener(type, fn, false);
	} else if(typeof document.attachEvent === 'function') {//IE
		el.attachEvent('on' + type, fn);
	} else {//DOM0接口
		el['on' + type] = fn;
	}
};

//方法二 initialize
if(typeof window.addEventListener === 'function') {//DOM2接口
	Event.addEventListener = function(el, type, fn) {
		el.addEventListener(type, fn, false);
	};
} else if(typeof document.attachEvent === 'function') {//IE
	Event.addEventListener = function(el, type, fn) {
		el.attachEvent('on' + type, fn);
	};
} else {//DOM0接口
	Event.addEventListener = function(el, type, fn) {
		el['on' + type] = fn;
	};
}

//方法三 lazy mode
Event.addEventListener = function(obj, eventType, listener){
	if (!Event.addEventListener)
	{
		if(typeof window.addEventListener === 'function') {//DOM2接口
			Event.addEventListener = function(el, type, fn) {
				el.addEventListener(type, fn, false);
			};
		} else if(typeof document.attachEvent === 'function') {//IE
			Event.addEventListener = function(el, type, fn) {
				el.attachEvent('on' + type, fn);
			};
		} else {//DOM0接口
			Event.addEventListener = function(el, type, fn) {
				el['on' + type] = fn;
			};
		}
	}
	Event.addEventListener(obj, eventType, listener);
}

第一种方法，不足之处在于只要用到这个函数就需要对DOM判断一遍，开始判断一遍是不是更好呢？

第二个方法，则是初始化的，判断了一次DOM，然后也使得Event.addEventListener指向了正确的方法，缺点就是不管用不用到这个函数，都被初始化了

这第三个方法正好补足了这点，所以被称做lazy mode,在不使用这个函数的情况下，就不会被初始化，也就减少了初始化的判断