浏览器是如何得知一个事件已经发生了的？

Question

最近在深入学习事件的捕获和冒泡这相关的问题：
我有这样一个认识，不知道对不对，各位可以看一看。

事件的传播机制分为三个阶段：捕获阶段、到达目标阶段、冒泡阶段。我认为这套传播机制存在的一个意义来监听究竟有没有事件发生，事件发生的类型是什么、事件发生在哪里。所谓的事件捕获，就是浏览器在查找有没有事件发生，至于事件发生之后的处理时机，则是通过注册事件处理函数，addEventListener()的最后一个参数实现的。

但是我按照这样的思路来走的话，就有了这样的一个问题。

比如我有这样一段代码

    <div>

        <a id="btn" href="http://www.baidu.com/">

    button

        </a>

    </div>

    <script>

     var btn=document.getElementById('btn');

     var disableClickHandler =  function(event){

        console.log('1');

        event.preventDefault();

        event.stopPropagation();

     };

    document.removeEventListener('click',disableClickHandler,true);

    btn.onclick = function () {

        console.log('success');

    }

    </script>

    

我采用捕获的方式来对事件处理，在事件处理函数中阻止了事件继续传播。这看起来很自然，但我的问题是，如果事件已经停止了传播，浏览器又是怎么知道这个事件发生的位置呢？它又是怎么知道一个事件已经发生了呢？如果它不知道一个事件已经发生了，又怎么会执行对应的事件处理程序呢？

Answer 1

你的矛盾是因为对捕获阶段的不正确理解。别被名字困扰了，捕获跟冒泡是同个层面的东西，一个自外向内，一个自内向外。所以事件中断是在传播过程中中断，而不是在传播之前。