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.
TheHTMLAudioElement interface provides access to the properties of<audio> elements, as well as methods to manipulate them.
This element is based on, and inherits properties and methods from, theHTMLMediaElement interface.
In this article
Constructor
Audio()Creates and returns a new
HTMLAudioElementobject, optionally starting the process of loading an audio file into it if the file URL is given.
Instance properties
No specific properties; inherits properties from its parent,HTMLMediaElement, and fromHTMLElement.
Instance methods
Inherits methods from its parent,HTMLMediaElement, and fromHTMLElement. It offers no methods of its own.
Examples
>Basic usage
You can create aHTMLAudioElement entirely with JavaScript using theAudio() constructor:
const audioElement = new Audio("car_horn.wav");then you can invoke theplay() method on the element
audioElement.play();Note:A common gotcha is trying to play an audio element immediately on page load. Modern browser's default autoplay policy will block that from happening. Refer toFirefox andchrome for best practices and workarounds.
Some of the more commonly used properties of the audio element includesrc,currentTime,duration,paused,muted, andvolume. This snippet copies the audio file's duration to a 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});Events
Inherits methods from its parent,HTMLMediaElement, and from its ancestorHTMLElement. Listen to events usingaddEventListener() or by assigning an event listener to theoneventname property of this interface.
Specifications
| Specification |
|---|
| HTML> # htmlaudioelement> |
Browser compatibility
See also
- Web media technologies
- Audio and Video Delivery
- HTML element implementing this interface:
<audio>.