VOOZH about

URL: https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail

⇱ CustomEvent: detail property - Web APIs | MDN


CustomEvent: detail property

Note: This feature is available in Web Workers.

The read-only detail property of the CustomEvent interface returns any data passed when initializing the event.

Value

Whatever data the event was initialized with.

Example

js
// create custom events
const catFound = new CustomEvent("animalfound", {
 detail: {
 name: "cat",
 },
});
const dogFound = new CustomEvent("animalfound", {
 detail: {
 name: "dog",
 },
});

const element = document.createElement("div"); // create a <div> element

// add an appropriate event listener
element.addEventListener("animalfound", (e) => console.log(e.detail.name));

// dispatch the events
element.dispatchEvent(catFound);
element.dispatchEvent(dogFound);

// "cat" and "dog" logged in the console

Specifications

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

Browser compatibility

See also

Help improve MDN

Learn how to contribute

This page was last modified on by MDN contributors.