js事件冒泡和事件捕获的详细介绍

(1)冒泡事件：事件按照从最特定的事件目标到最不特定的事件目标(文档对象)的顺序触发。IE 5.5: div-body-document IE 6.0: div-body-html-document Mozilla 1.0: div-body-html-document-window(2)事件captur。Ing):事件从最不精确的对象(文档对象)开始触发，然后到最精确的对象(事件也可以在窗口级别捕获，但必须由开发人员特别指定)。(3)DOM事件流：支持两种事件模型：捕获事件和冒泡事件，但捕获事件先发生。两种事件流将触及DOM中的所有对象，从文档对象开始，到文档对象结束。DOM事件模型最独特的属性是文本节点也触发事件(IE中没有)。支持W3C标准的浏览器在添加事件时使用addeventlistener (event，fn，useCapture)方法。基础中的第三个参数usecapture是一个布尔值，用于设置事件是在捕获时执行还是在事件冒泡时执行。而与W3C不兼容的浏览器(IE)使用的是attachEvent()方法，该方法没有相关设置，但是IE的事件模型默认在事件冒泡时执行，也就是当useCapture等于false时执行，所以在处理事件时将useCapture设置为false更安全，达到与浏览器兼容的效果。

事件捕获阶段：从顶部标签向下搜索事件，直到捕获到事件目标。事件冒泡阶段：事件从事件目标开始，向上冒泡到页面的顶部选项卡。假设一个元素div有一个子元素p，Divp元素/p/div都与click事件绑定。如果用户点击p，就会触发div和p上的click事件，这两个事件处理程序应该先执行哪个？事件的顺序是什么？在这两种模式之前，网景和微软是不同的实现。在网景中，div首先触发，这被称为事件捕获。在微软，p先触发，称为事件冒泡。这两个事件的处理顺序正好相反。IE只支持事件冒泡，Mozilla、Opera 7和Konqueror都支持，而Opera的老版本和iCab不支持。事件捕获使用事件捕获时，先触发父元素，后触发子元素，即先触发div，后触发p。事件冒泡使用事件冒泡时，子元素先触发，父元素后触发，即p先触发，div后触发。W3C模型W3C模型中和了这两者。在W3C模型中，当任何事件发生时，从顶层捕获事件，直到事件触发器到达事件源元素。然后，从事件源开始，执行事件冒泡，直到到达文档。程序员可以选择在绑定事件时是使用事件捕获还是事件冒泡。方法是在绑定事件时使用addEventListener函数。它有三个参数。如果第三个参数为真，则表示使用事件捕获；如果为false，则意味着使用事件冒泡。埃勒。addeventlistener ('click '，something 2，true) true=capture false=bubble传统的绑定事件模式在支持W3C DOM的浏览器中，像这样的通用绑定事件模式就是事件bubble模式。ele . onclick=dosame 2 IE浏览器如上所述，IE只支持事件冒泡，不支持事件捕获，也不支持addEventListener函数，所以不会用第三个参数来表示是冒泡还是捕获，它提供了另外一个函数attachEvent。ele.attachEvent('onclick '，dosomether 2)；附件：事件冒泡(流程):事件从目标(event.srcElement||event.target)开始，沿着文档一层一层往上冒泡，直到文档。可以阻止事件传播：在W3c中，使用stopPropagation()方法设置cancelBubble=true在IE下；捕获期间停止传播()；以后，冒泡过程就不会发生了~3。防止事件的默认行为，比如点击A ~后跳转在W3c中，使用preventDefault()方法；在IE下设置window . event . return value=false；4.哇，终于完成了。在测试的时候，并不是所有的事件都可以冒泡，比如模糊、聚焦、加载和卸载(这是取自别人的文章，我没有测试)。