Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

HTMLAudioElement

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨Juli 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 von diesem Eigenschaften und Methoden.

EventTarget Node Element HTMLElement HTMLMediaElement HTMLAudioElement

Konstruktor

Audio()

Erstellt und gibt ein neues HTMLAudioElement-Objekt zurück. Optional kann der Ladevorgang einer Audio-Datei in das Objekt gestartet werden, wenn die Dateiadresse angegeben ist.

Instanz-Eigenschaften

Keine spezifischen Eigenschaften; erbt Eigenschaften von seinem Elterninterface HTMLMediaElement und vom HTMLElement.

Instanz-Methoden

Erbt Methoden von seinem Elterninterface HTMLMediaElement und vom HTMLElement. Es bietet keine eigenen Methoden an.

Beispiele

Grundlegende Verwendung

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 play()-Methode auf dem Element aufrufen

js
audioElement.play();

Hinweis: Ein häufiger Fehler ist der Versuch, ein Audio-Element direkt beim Laden der Seite abzuspielen. Die Standard-Autoplay-Richtlinie moderner Browser wird dies blockieren. Weitere Informationen finden Sie bei Firefox und Chrome für bewährte Verfahren und Umgehungen.

Einige der am häufigsten verwendeten Eigenschaften des Audio-Elements 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
});

Events

Erbt Methoden von seinem Elterninterface HTMLMediaElement und von seinem Vorfahren HTMLElement. Sie können Events mit addEventListener() überwachen oder einen Event-Listener an die oneventname-Eigenschaft dieses Interfaces zuweisen.

Spezifikationen

Specification
HTML
# htmlaudioelement

Browser-Kompatibilität

Siehe auch