Our volunteers haven't translated this article into Türkçe yet. Join us and help get the job done!
You can also read the article in English (US).

The TrackEvent interface, part of the HTML DOM specification, is used for events which represent changes to the set of available tracks on an HTML media element; these events are addtrack and removetrack. It's important not to confuse TrackEvent with the RTCTrackEvent interface, which is used for tracks which are part of an RTCPeerConnection.

Events based on TrackEvent are always sent to one of the media track list types:


Creates and initializes a new TrackEvent object with the event type specified, as well as optional additional properties.


TrackEvent is based on Event, so properties of Event are also available on TrackEvent objects.

track Read only
The DOM track object the event is in reference to. If not null, this is always an object of one of the media track types: AudioTrack, VideoTrack, or TextTrack).


TrackEvent has no methods of its own; however, it is based on Event, so it provides the methods available on Event objects.


This example sets up a function, handleTrackEvent(), which is callled for any addtrack or removetrack event on the first <video> element found in the document.

var videoElem = document.querySelector("video");

videoElem.videoTracks.addEventListener("addtrack", handleTrackEvent, false);
videoElem.videoTracks.addEventListener("removetrack", handleTrackEvent, false);
videoElem.audioTracks.addEventListener("addtrack", handleTrackEvent, false);
videoElem.audioTracks.addEventListener("removetrack", handleTrackEvent, false);
videoElem.textTracks.addEventListener("addtrack", handleTrackEvent, false);
videoElem.textTracks.addEventListener("removetrack", handleTrackEvent, false);

function handleTrackEvent(event) {
  var trackKind;

  if (event.target instanceof(VideoTrackList)) {
    trackKind = "video";
  } else if (event.target instanceof(AudioTrackList)) {
    trackKind = "audio";
  } else if (event.target instanceof(TextTrackList)) {
    trackKind = "text";
  } else {
    trackKind = "unknown";

  switch(event.type) {
    case "addtrack":
      console.log("Added a " + trackKind + " track");
    case "removetrack":
      console.log("Removed a " + trackKind + " track");

The event handler uses the JavaScript instanceof operator to determine which type of track the event occurred on, then outputs to console a message indicating what kind of track it is and whether it's being added to or removed from the element.


Specification Status Comment
HTML Living Standard
The definition of 'TrackEvent' in that specification.
Living Standard Initial definition.
The definition of 'TrackEvent' in that specification.
Recommendation Initial definition.

Browser compatibility

No compatibility data found. Please contribute data for "api.TrackEvent" (depth: 1) to the MDN compatibility data repository.

Document Tags and Contributors

Contributors to this page: mdnwebdocs-bot, Sheppy
Last updated by: mdnwebdocs-bot,