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;
		}
	},