javascriptはDOMに事件の方法の3種類の書き方を結び付けます.

2043 ワード

コードを言わずに:

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.adevent Listenerが正しい方法を指しています.欠点はこの関数を使わないことです.初期化されました.
この三つ目の方法はちょうどこの点を補足していますので、lazy modeと呼ばれています.この関数を使わないと初期化されません.初期化の判断が減ります.