事件：currentTarget 屬性
注意：此功能在 Web Workers 中可用。
Event 介面的只讀屬性 currentTarget 用於標識事件處理程式已附加到的元素。
這並不總是與觸發事件的元素相同，因為事件可能在一個帶有處理程式的元素的後代上觸發，然後 冒泡 到帶有處理程式的元素上。觸發事件的元素由 Event.target 提供。
請注意，currentTarget 的值僅在事件的處理程式中可用。在事件處理程式之外，它將為 null。這意味著，例如，如果您在事件處理程式中獲取了 Event 物件的引用，然後在事件處理程式之外訪問其 currentTarget 屬性，其值將為 null。
值
一個代表當前事件處理程式已附加到的物件的 EventTarget。
示例
currentTarget 與 target
此示例說明了 currentTarget 和 target 之間的區別。
HTML
頁面上有一個包含“子”<div> 的“父”<div>。
html
<div id="parent">
Click parent
<div id="child">Click child</div>
</div>
<button id="reset">Reset</button>
<pre id="output"></pre>
JavaScript
事件處理程式已附加到父級。它會記錄 event.currentTarget 和 event.target 的值。
我們還有一個“重置”按鈕，用於重新載入示例。
js
const output = document.querySelector("#output");
const parent = document.querySelector("#parent");
parent.addEventListener("click", (event) => {
const currentTarget = event.currentTarget.getAttribute("id");
const target = event.target.getAttribute("id");
output.textContent = `Current target: ${currentTarget}\n`;
output.textContent += `Target: ${target}`;
});
const reset = document.querySelector("#reset");
reset.addEventListener("click", () => document.location.reload());
結果
如果您單擊子 <div> 內部，則 target 標識子級。如果您單擊父 <div> 內部，則 target 標識父級。
在這兩種情況下，currentTarget 都標識父級，因為處理程式已附加到該元素。
規範
| 規範 |
|---|
| DOM # ref-for-dom-event-currenttarget② |
瀏覽器相容性
載入中…