javascript事件知識整理
javascript是一個事件驅動語言，所以事件處理是javascript開發中至關重要的一部分。從文檔加載到用戶交互，javascript可以捕捉和響應多種類型的事件，例如鼠標移動，點擊，鍵盤按鍵等等。本文旨在整理javascript中事件的相關知識，從而更好地掌握它的應用。
事件流
javascript定義了事件流（event flow）來描述從文檔根節點到目標元素的事件傳播的過程。事件流分為三個階段：捕獲階段（capture phase）、目標階段（target phase）和冒泡階段（bubble phase）。
捕獲階段當一個事件發生時，會首先從文檔根節點向下傳遞直到目標元素的父元素為止，這個就是捕獲階段。在這個階段，事件的目標元素還沒有被觸發，只是當作傳遞路徑中的一部分。
目標階段當事件傳遞到目標元素時，它就觸發了該元素的事件處理程序。
冒泡階段事件會從目標元素開始向上傳遞，直到到達文檔根節點為止。這個階段可以讓多個元素響應同樣的事件。
DOM0級事件處理程序
DOM0級事件處理程序就是在HTML中直接通過元素的屬性來指定事件處理程序的方法。例如：

<button onclick="alert('hello world!')">Click me!</button>

通過這種方式指定的處理程序是全局有效的，當元素被移除或替換時，它們也被移除。因為這種方式的不足，所以現在很少使用。
DOM2級事件處理程序
DOM2級事件處理程序是一個重要的改進。它解決了DOM0級事件處理程序的一些限制，同時還引入了新的概念。
DOM2級事件處理程序是通過添加事件監聽器來實現的。一個事件監聽器實際上就是一個函數，它負責處理特定類型的事件。要添加事件監聽器，我們需要調用元素的addEventListener()方法。例如：

button.addEventListener('click', function() {
alert('hello world!');
});

該方法接受兩個參數: 要處理的事件類型（click）和事件處理程序（函數）。DOM2級事件處理程序可以給同一元素的同一事件類型添加多個事件處理程序，它們將按照添加的順序依次執行。
使用removeEventListener()方法可以移除事件監聽器。需要注意的是，為了移除事件監聽器，必須使用跟添加監聽器同樣的函數。這也是為什么我們經常使用匿名函數來聲明處理程序的原因，因為我們無法移除這個匿名函數。

button.removeEventListener('click', handleClick);

DOM2級事件處理程序也引入了事件對象的概念。事件對象包含了與事件相關的信息，例如事件的類型，目標元素，鼠標位置等等。事件處理程序通過參數的方式獲取到事件對象："function(event){}" 。
event.target：目標元素
event.type：事件類型
event.clientX 和 event.clientY：鼠標指針的坐標
event.keyCode：鍵盤鍵碼
事件對象的傳遞是自動進行的，傳遞方向是從捕獲階段到目標階段再到冒泡階段。而且，可以通過使用stopPropagation()方法來阻止事件的傳遞。

document.addEventListener('click', function(event) {
event.stopPropagation();
});

DOM3級事件處理程序
DOM3級事件處理程序是對DOM2級事件處理程序的擴展。它增加了更多的事件類型，例如變化事件、鍵盤事件等等。同時，它還規范了DOM2級事件處理程序的一些細節，例如命名空間。它還提供了一些新方法，例如setUserData()和getUserData()方法，通過這些方法，我們可以在事件處理程序之間傳遞一些數據。
HTML5中，一些動態事件（例如添加新的DOM節點時），需要使用DOM3級事件處理程序來完成。
總結
javascript中的事件處理是非常重要的一部分。本文介紹了javascript中的事件流、DOM0級事件處理程序、DOM2級事件處理程序和DOM3級事件處理程序。通過這些知識，我們可以更好地處理javascript代碼中的事件，從而使代碼更加流暢、友善。