HTMLAudioElement
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 HTMLAudioElement
-Interface bietet Zugriff auf die Eigenschaften von <audio>
-Elementen sowie Methoden zu deren Manipulation.
Dieses Element basiert auf dem HTMLMediaElement
-Interface und erbt dessen Eigenschaften und Methoden.
Konstruktor
Audio()
-
Erstellt und gibt ein neues
HTMLAudioElement
-Objekt zurück und beginnt optional mit dem Laden einer Audiodatei, wenn die Datei-URL angegeben wird.
Instanz-Eigenschaften
Keine spezifischen Eigenschaften; erbt Eigenschaften von seinem übergeordneten HTMLMediaElement
und von HTMLElement
.
Instanz-Methoden
Erbt Methoden von seinem übergeordneten HTMLMediaElement
und von HTMLElement
. Es bietet keine eigenen Methoden an.
Beispiele
Grundlegende Nutzung
Sie können ein HTMLAudioElement
vollständig mit JavaScript unter Verwendung des Audio()
-Konstruktors erstellen:
const audioElement = new Audio("car_horn.wav");
dann können Sie die Methode play()
auf dem Element aufrufen
audioElement.play();
Hinweis: Ein häufiger Stolperstein ist der Versuch, ein Audioelement sofort beim Laden der Seite abzuspielen. Die standardmäßige Autoplay-Richtlinie moderner Browser blockiert dies. Schauen Sie sich die Best Practices und Lösungen für Firefox und Chrome an.
Einige der am häufigsten verwendeten Eigenschaften des Audioelements sind src
, currentTime
, duration
, paused
, muted
und volume
. Dieses Snippet kopiert die Dauer der Audiodatei in eine Variable:
const audioElement = new Audio("car_horn.wav");
audioElement.addEventListener("loadeddata", () => {
let duration = audioElement.duration;
// The duration variable now holds the duration (in seconds) of the audio clip
});
Ereignisse
Erbt Methoden von seinem übergeordneten HTMLMediaElement
und von seinem Vorfahren HTMLElement
. Sie können Ereignisse mithilfe von addEventListener()
anhören oder einen Ereignis-Listener der oneventname
-Eigenschaft dieses Interfaces zuweisen.
Spezifikationen
Specification |
---|
HTML # htmlaudioelement |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
HTMLAudioElement | ||||||||||||
Audio() constructor |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
Siehe auch
- Webmedia-Technologien
- Audio- und Videowiedergabe
- HTML-Element, das dieses Interface implementiert:
<audio>
.