TextTrack

Baseline Widely available

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

Das TextTrack-Interface der WebVTT-API repräsentiert eine Textspur, die mit einem Medienelement verknüpft ist.

Ein Objekt dieses Typs besitzt die Liste von VTTCue-Objekten, die zu verschiedenen Zeitpunkten über dem Video angezeigt werden.

TextTrack-Objekte können einem HTMLVideoElement oder HTMLAudioElement mithilfe der HTMLMediaElement.addTextTrack()-Methode hinzugefügt werden, was den gleichen Effekt hat wie das deklarative Hinzufügen von Textspuren mit <track>-Elementen innerhalb eines <video> oder <audio>-Elements. Die TextTrack-Objekte werden in einer TextTrackList gespeichert, die über die HTMLMediaElement.textTracks-Eigenschaft abgerufen werden kann.

Instanz-Eigenschaften

Dieses Interface erbt auch Eigenschaften von EventTarget.

TextTrack.activeCues Schreibgeschützt: Ein TextTrackCueList-Objekt, das die aktuell aktive Menge von Texttrack-Hinweisen auflistet. Track-Hinweise sind aktiv, wenn die aktuelle Wiedergabeposition des Mediums zwischen den Start- und Endzeiten der Hinweise liegt. Daher werden für angezeigte Hinweise wie Untertitel oder Bildunterschriften die aktiven Hinweise derzeit angezeigt.
TextTrack.cues Schreibgeschützt: Ein TextTrackCueList, das alle Hinweise der Spur enthält.
TextTrack.id Schreibgeschützt: Ein String, der die Spur identifiziert, falls sie eine hat. Wenn sie keine ID hat, ist dieser Wert ein leerer String (""). Falls das TextTrack mit einem <track>-Element verknüpft ist, stimmt die ID der Spur mit der ID des Elements überein.
TextTrack.inBandMetadataTrackDispatchType Schreibgeschützt: Gibt einen String zurück, der den in-band Metadata Track Dispatch-Typ der Spur angibt.
TextTrack.kind Schreibgeschützt: Gibt einen String zurück, der angibt, welche Art von Texttrack das TextTrack beschreibt. Es muss einer der erlaubten Werte sein.
TextTrack.label Schreibgeschützt: Ein menschenlesbarer String, der die Bezeichnung der Textspur enthält, falls vorhanden; andernfalls ist dies ein leerer String (""), in welchem Fall ein benutzerdefiniertes Etikett von Ihrem Code unter Verwendung anderer Attribute der Spur generiert werden muss, falls das Etikett der Spur dem Benutzer angezeigt werden muss.
TextTrack.language Schreibgeschützt: Ein String, der die Textsprache angibt, in der der Inhalt der Textspur geschrieben ist. Der Wert muss dem in RFC 5646: Tags for Identifying Languages (also known as BCP 47) angegebenen Format entsprechen, genau wie das HTML-Attribut lang. Zum Beispiel kann dies "en-US" für US-Englisch oder "pt-BR" für brasilianisches Portugiesisch sein.
TextTrack.mode: Ein String, der den aktuellen Modus der Spur angibt, der einer der erlaubten Werte sein muss. Wenn der Wert dieser Eigenschaft geändert wird, wird der aktuelle Modus der Spur entsprechend geändert. Standardmäßig ist er disabled, es sei denn, das default-boolesche Attribut des <track>-Elements ist auf true gesetzt — in diesem Fall ist der Standardmodus showing.
sourceBuffer Schreibgeschützt: Der SourceBuffer, der die Spur erstellt hat. Gibt null zurück, falls die Spur nicht von einem SourceBuffer erstellt wurde oder der SourceBuffer aus den MediaSource.sourceBuffers-Attributen seiner übergeordneten Medienquelle entfernt wurde.

Instanz-Methoden

Dieses Interface erbt auch Methoden von EventTarget.

Hinweis: Das Interface TextTrackCue ist eine abstrakte Klasse, die als Elternteil für andere Hinweis-Interfaces wie VTTCue dient. Daher werden beim Hinzufügen oder Entfernen eines Hinweises einer der Hinweis-Typen übergeben, die von TextTrackCue erben.

TextTrack.addCue(): Fügt der Liste der Hinweise der Spur einen Hinweis (spezifiziert als TextTrackCue-Objekt) hinzu.
TextTrack.removeCue(): Entfernt einen Hinweis (spezifiziert als TextTrackCue-Objekt) aus der Liste der Hinweise der Spur.

Ereignisse

cuechange: Wird ausgelöst, wenn Hinweise betreten und verlassen werden. Ein bestimmter Text-Hinweis erscheint, wenn der Hinweis betreten wird und verschwindet, wenn der Hinweis verlassen wird. Auch verfügbar über die oncuechange-Eigenschaft.

Beispiel

Das folgende Beispiel fügt einem Video eine neue TextTrack-Spur hinzu und stellt sie zur Anzeige mit TextTrack.mode ein.

let video = document.querySelector("video");
let track = video.addTextTrack("captions", "Captions", "en");
track.mode = "showing";

Spezifikationen

Specification
HTML Standard # texttrack

Browser-Kompatibilität

BCD tables only load in the browser