CustomEvent: detail プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021.

detailCustomEvent インターフェイスの読み取り専用プロパティで、イベントを初期化する際に渡された何らかのデータを返します。

イベントの初期化に使用したデータです。

js
// カスタムイベントを作成
const catFound = new CustomEvent("animalfound", {
  detail: {
    name: "cat",
  },
});
const dogFound = new CustomEvent("animalfound", {
  detail: {
    name: "dog",
  },
});

// 適切なイベントリスナーを追加
obj.addEventListener("animalfound", (e) => console.log(e.detail.name));

// イベントの配信
obj.dispatchEvent(catFound);
obj.dispatchEvent(dogFound);

// "cat" および "dog" がコンソールの出力される

仕様書

Specification
DOM Standard
# ref-for-dom-customevent-detail②

ブラウザーの互換性

BCD tables only load in the browser

関連情報