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.

EventTarget Node Element HTMLElement HTMLMediaElement HTMLAudioElement

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:

js
const audioElement = new Audio("car_horn.wav");

dann können Sie die Methode play() auf dem Element aufrufen

js
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:

js
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 GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
HTMLAudioElement
Audio() constructor

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch