本文主要介绍JavaScript中事件冒泡机制的相关信息。详细介绍了什么是冒泡，冒泡捕获的必要性以及冒泡和捕获的具体区别。有需要的可以参考一下。
什么是冒泡？
DOM事件流有三个阶段：事件捕获阶段、目标阶段和事件冒泡阶段。
事件捕获：通俗的理解是，当鼠标点击或触发一个dom事件时，浏览器会将事件从根节点由外向内传播，即子元素被点击。如果父元素通过事件捕获注册了相应的事件，则父元素绑定的事件将首先被触发。
称为冒泡：与事件捕获相反，事件冒泡的顺序是从内向外到根节点的事件传播。
标准dom事件流的触发顺序是：先捕获后冒泡，即当dom事件被触发时，事件会先被捕获，事件源被捕获后事件会通过事件传播冒泡。不同的浏览器对此有不同的实现。IE10及以下版本不支持捕获事件，因此缺少一个事件捕获阶段。IE11、Chrome、Firefox、Safari等浏览器同时存在。
AddEventListener()方法
该方法设置一个事件监听器，当事件发生时，通过设置的参数执行操作。语法是：
addEventListener(事件，函数，使用捕获)
事件参数是必需的，指示被监控的事件，例如点击、触摸开始等。是以前没有前缀的事件。
function参数也是必需的，指示事件触发后调用的函数。它可以是外部定义的函数，也可以是匿名函数。
参数useCapture是可选的。填写“真”或“假”来描述事件是冒泡还是正在捕获。true表示捕获，默认false表示冒泡。
移除事件监听
如果要移除addEventListener()添加的事件监听，需要使用removeEventListener()。语法是：
removeEventListener(事件，函数)
与参数addEventListener()一致。
兼容性
IE和更早的版本，以及Opera 7.0和更早的版本，都不支持addEventListener()和removeEventListener()方法。相反，他们使用以下方法：
添加事件：
attachEvent(事件，函数)
删除事件：
**分离事件(事件，函数)* *
兼容性问题可以通过以下方式解决：
if (div1.addEventListener) {
div1.addEventListener('click '，function () {
Console.log('支持')
});
} else if (div1.attachEvent) {
div1.attachEvent('onclick '，function () {
Console.log(“不支持”)
});
}
冒泡和陷印的具体区别
超文本标记语言
div id='div1 '
div id='div2'/div
/div
射流研究…
脚本
var div 1=document . getelementbyid(' div 1 ')；
var div 2=document . getelementbyid(' div 2 ')；
div1.addEventListener('click '，function(){
console . log(' div 1-1-捕获阶段')
}，真)；
div2.addEventListener('click '，function(){
console . log(' div 2-2-捕获阶段')
}，真)；
div1.addEventListener('click '，function(){
console . log(' div 1-1-冒泡阶段')
});
div2.addEventListener('click '，function(){
console . log(' div 2-2-冒泡阶段')
});
/脚本
输出(单击div2时执行的结果)
解决办法
函数停止气泡(e) {
如果(例如停止传播){
e .停止传播()；//所以它支持W3C的stopPropagation()方法
}否则{
window . event . cancel bubble=true；//否则需要用IE取消事件冒泡。
}
}
总结
这就是关于JavaScript中事件冒泡机制的文章。有关JavaScript事件冒泡的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。