Fatal编程技术网
  • javascript/
  • Javascript 占主导地位的气泡相

Javascript 占主导地位的气泡相

javascript

Javascript 占主导地位的气泡相,javascript,Javascript,我正在学习JavaScript事件冒泡和捕获阶段。在此过程中，我遇到了一个问题。以下是代码： <html> <body> <p id="para">Learning <span id="span"><b>events</b></span></p> <script> document.getElementById("pa

我正在学习JavaScript事件冒泡和捕获阶段。在此过程中，我遇到了一个问题。以下是代码：

<html>
    <body>    
        <p id="para">Learning <span id="span"><b>events</b></span></p>
        <script>
            document.getElementById("para").addEventListener("click",function(){
                                                          alert("Paragraph was clicked");
                                                               },true);
             document.getElementById("span").addEventListener("click",function(){
                                                          alert("Span was clicked");
                                                               },false);                                                 
        </script>    
    </body>
</html>


学习活动

document.getElementById（“para”）.addEventListener（“单击”，函数）（）{
警告（“点击段落”）；
}，对）；
document.getElementById（“span”）.addEventListener（“单击”，函数）（）{
警报（“已单击范围”）；
}，假）；
问题是当我点击span元素时，段落元素上的警报首先触发，然后是span上的警报。我想这可能是因为我在段落元素上设置了捕获阶段。我的问题是原因。为什么会这样做？？根据定义，它应该首先触发跨度上的事件，然后触发段落上的事件

提前感谢…

是的，这是因为您已明确地将
标记上的事件设置为在捕获阶段执行

由于捕获阶段首先发生，因此该事件处理程序首先执行

由于您已将
span
上的事件侦听器设置为在冒泡阶段执行（通过在第三个参数中提供false），因此它将在段落标记的处理程序之后执行

这是一个很好的解释。如果解释回答了您的问题，如果您能接受答案，我们将不胜感激。