javascript中的dom事件流

Question

最近在学习dom事件流。看网上视频有一句话不是很理解：JS代码中只能执行捕获或者冒泡其中的一个阶段。
我进行代码实操如下：

<div id="father">
     <div id="son"></div>
</div>

var father = document.getElementById('father');
var son = document.getElementById('son');
  father.addEventListener("click", function(){
    console.log("冒泡爸爸")
  },false)
  son.addEventListener("click", function(){
    console.log("冒泡儿子")
  },false)
  document.addEventListener("click", function(){
    console.log("捕获document")
  },true)
  son.addEventListener("click", function(){
    console.log("捕获儿子")
  },true)

运行结果：

这里边可以看出捕获和冒泡都执行了。但是不是说 “JS代码中只能执行捕获或者冒泡其中的一个阶段”吗？

Answer 1

1、有执行顺序，比如冒泡，会先从子事件执行，再到父事件执行
2、有时候只想子事件触发，父事件不触发，就可以再子事件里设置一个组织冒泡