HTMLAudioElement
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Die HTMLAudioElement-Schnittstelle bietet Zugriff auf die Eigenschaften von <audio>-Elementen sowie Methoden, um sie zu bearbeiten.
Diese Schnittstelle basiert auf der Schnittstelle HTMLMediaElement und erbt deren Eigenschaften und Methoden.
Konstruktor
Audio()-
Erstellt ein neues
HTMLAudioElement-Objekt und gibt es zurück. Wenn eine Datei-URL angegeben wird, beginnt optional das Laden der Audiodatei.
Instanzeigenschaften
Keine eigenen Eigenschaften; erbt Eigenschaften von der übergeordneten Schnittstelle HTMLMediaElement und von HTMLElement.
Instanzmethoden
Erbt Methoden von der übergeordneten Schnittstelle HTMLMediaElement und von HTMLElement. Die Schnittstelle bietet keine eigenen Methoden.
Ereignisse
Erbt Methoden von der übergeordneten Schnittstelle HTMLMediaElement und von der Vorfahrenschnittstelle HTMLElement. Sie können Ereignisse mit addEventListener() überwachen oder der Eigenschaft oneventname dieser Schnittstelle einen Event-Listener zuweisen.
Beispiele
Grundlegende Verwendung
Sie können ein HTMLAudioElement vollständig mit JavaScript erstellen, indem Sie den Konstruktor Audio() verwenden:
const audioElement = new Audio("car_horn.wav");
Anschließend können Sie die Methode play() für das Element aufrufen:
audioElement.play();
Hinweis: Eine häufige Fehlerquelle ist der Versuch, ein Audioelement unmittelbar beim Laden der Seite abzuspielen. Die standardmäßigen Autoplay-Richtlinien moderner Browser verhindern dies. Empfehlungen und mögliche Lösungen finden Sie in den Artikeln zu Firefox und Chrome.
Zu den häufig verwendeten Eigenschaften des Audioelements gehören src, currentTime, duration, paused, muted und volume. Der folgende Codeausschnitt speichert die Dauer der Audiodatei in einer Variablen:
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
});
Spezifikationen
| Spezifikation |
|---|
| HTML # htmlaudioelement |
Browser-Kompatibilität
Siehe auch
- Web-Medientechnologien
- Bereitstellung von Audio und Video
- HTML-Element, das diese Schnittstelle implementiert:
<audio>.