javascript - 瀏覽器是如何得知一個事件已經發生了的？

Question

最近在深入學習事件的捕獲和冒泡這相關的問題：
我有這樣一個認識，不知道對不對，各位可以看一看。

事件的傳播機制分為三個階段：捕獲階段、到達目標階段、冒泡階段。我認為這套傳播機制存在的一個意義來監聽究竟有沒有事件發生，事件發生的類型是什麼、事件發生在哪裡。所謂的事件捕獲，就是瀏覽器在查找有沒有事件發生，至於事件發生之後的處理時機，則是透過註冊事件處理函數，addEventListener()的最後一個參數實現的。

但是我按照這樣的思路來走的話，就有了這樣的一個問題。

比如我有這樣一段程式碼

    <p>
        <a id="btn" href="http://www.baidu.com/">
    button
        </a>
    </p>
    <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

你的矛盾是因為對捕獲階段的不正確理解。別被名字困擾了，捕獲跟冒泡是同層的東西，一個自外向內，一個自內向外。所以事件中斷是在傳播過程中中斷，而不是在傳播之前。

Answer 2

如果你說的是如何取得的。 我覺得答案在 JavaScript Event Loop

Links: https://developer.mozilla.org...

Answer 3

程式碼是瀏覽器幫你執行的，事件發生是瀏覽器偵測到的，然後是瀏覽器幫你執行你制定的事件。

所以你問瀏覽器是怎麼知道的？

Answer 4

這是因為，javascript是一種指令性語言，什麼是指令語言呢？就是你寫的每一條javascript語句都是一條指令，通知瀏覽器去做某些事，比如，最簡單的document.getElementById(),實際上也是通知瀏覽器去獲取相關dom，而非javascript自己做的。事件處理也是如此。

Answer 5

點擊執行disableClickHandler，阻止了事件傳播，so.....

Answer 6

如果事件已經停止了傳播，瀏覽器又是怎麼知道這個事件發生的位置呢?

它不想知道。

它又是怎麼知道一個事件已經發生了？

它也不知道。

如果它不知道一個事件已經發生了，又怎麼會執行對應的事件處理程序呢？

它說它很懶。