javascript的事件機制

首先，讓我們來看一幅圖，這樣便讓我們更加理解JS的事件機制，如圖：

首先，讓我們來舉個例子，在兩個同心圓中，當我們來點圓心的時候，其實我們點的是兩個圓的圓心，那我們如何來區分我們點擊是哪個圓的圓心呢？那麼聯繫我們Web裏面，在界面上，當我們來點擊某個元素的時候，我們又是怎麼區分的呢？其實早在IE4與Netscope瀏覽器之爭的時候，他們提出來了兩個方案，得到兩個完全不同事件概念。

IE的事件冒泡：聯繫冒泡，我們知道在水中冒泡的原理，即是水泡一直往上冒出的過程，那麼當我們點擊頁面的某個元素時，先是從最底層的子元素開始的；

Netscope的事件捕獲： 即與事件冒泡截然相反，即我們是最先點擊最外層的元素；

於是：對於事件的處理，DOM0級是按冒泡事件處理的，DOM2級事件處理則綜合了兩個事件處理的過程的；先捕獲事件，然後進行冒泡處理；

下面我給出跨瀏覽器的事件處理js:

<span style="white-space:pre">	</span>addHandle: function(obj,type,fn) {
		if(window.addEventListener) {
			obj.addEventListener(type,fn,false);
		} else if(window.attachEvent) {
			obj.attachEvent('on'+type,fn);
		} else {
			obj['on'+type] = fn;
		}
	},

	removeHandle: function(obj,type,fn) {
		if(window.addEventListener) {
			obj.removeEventListener(type,fn,false);
		} else if(window.attachEvent) {
			obj.detachEvent('on'+type,fn);
		} else {
			obj['on'+type] = null;
		}
	},