事件的冒泡、绑定、传播、委派

所谓的事件的冒泡指的就是事件的向上传导，当后代元素上的事件被触发时，其祖先元素的相同事件也会被触发。在开发中大部分情况冒泡都是有用的，如果不希望发生事件冒泡，可以通过事件对象来取消冒泡。

可以将事件对象的cancelBubble设置为true，即可取消冒泡

event.cancelBubble = true;

- addEventListener()

通过这个方法也可以为元素绑定响应函数，参数：

1.事件的字符串，不要on

2.回调函数，当事件触发时该函数会被调用

3.是否在捕获阶段触发事件，需要一个布尔值，一般都传false

使用addEventListener（）可以同时为一个元素的相同事件同时绑定多个响应函数，这样当事件被触发时，响应函数将会按照函数的绑定顺序执行。注意：这个方法不支持IE8及以下的浏览器。

btn1.addEventListener("click",function(){
				alert("1");
			},false);

- attachEvent （）

在IE8中可以使用attachEvent()来绑定事件，参数：

1.事件的字符串，要on

扫描二维码关注公众号，回复： 7592891 查看本文章

2.回调函数

这个方法也可以同时为一个事件绑定多个处理函数，不同的是它是后绑定先执行，执行顺序和addEventListener（）相反

关于事件的传播网景公司和微软公司有不同的理解：

微软公司认为事件应该是由内向外传播的，也就时当时间触发时，应该触发当前元素上的事件，然后在向当前元素的祖先元素上传播，也就时在冒泡阶段执行。

网景公司认为事件应该是由内向外传播的，也就时当前事件触发时，应该先触发当前元素的最外层的祖先元素的事件，然后在箱内传播给后代元素。

W3C综合了两个公司的方案，将事件传播分成了三个阶段：

1.捕获阶段：在捕获阶段时，从最外层的祖先元素，向目标进行事件的捕获，但是默认此时不会触发事件。

2.目标阶段：事件捕获到目标元素，捕获结束开始在目标元素上触发事件

3.冒泡阶段：事件从目标元素向他的祖先元素传递，依次触发祖先元素上的事件

如果希望在捕获阶段就触发事件，可以将addEventListener() 的第三个参数设置为true，一般情况下我们不会希望在捕获阶段触发事件，所以这个参数一般都是false。IE8及以下浏览器中没有捕获阶段。

指将事件统一绑定给元素共同的祖先元素，这样当后代元素上的事件触发时，会一直冒泡到祖先元素，从而通过祖先元素的响应单数来处理事件。事件的委派是利用了冒泡，通过委派可以减少事件绑定的次数，提高程序的性能。