Nos bénévoles n'ont pas encore traduit cet article en Français. Inscrivez-vous et aidez-nous à réaliser cette tâche !
Vous pouvez également lire cet article en English (US).
The HTMLAudioElement
interface provides access to the properties of <audio>
elements, as well as methods to manipulate them. It derives from the HTMLMediaElement
interface.
<div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#D4DDE4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLElement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#D4DDE4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#D4DDE4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#D4DDE4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement" target="_top"><rect x="331" y="65" width="160" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="411" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLMediaElement</text></a><polyline points="331,89 321,84 321,94 331,89" stroke="#D4DDE4" fill="none"/><line x1="321" y1="89" x2="291" y2="89" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement" target="_top"><rect x="131" y="65" width="160" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text x="211" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLAudioElement</text></a></svg></div>
a:hover text { fill: #0095DD; pointer-events: all;}
Properties
No specific properties; inherits properties from its parent, HTMLMediaElement
, and from HTMLElement
.
Methods
Inherits methods from its parent, HTMLMediaElement
, and from HTMLElement
.
Constructor
Syntax
mySound = new Audio([URLString]);
Description
Constructor for audio elements. The preload
property of the returned object is set to auto
and the src
property is set to the argument value. The browser begins asynchronously selecting the resource before returning the object.
Note: An Audio element constructed with new Audio()
won't be garbage collected as long as playback is in progress. It will continue playing and be audible until pause()
is called or playback finishes.
Parameters
URLString
(expected type:DOMString
; optional)- The
src
property of the constructedHTMLAudioElement
.
Regular methods
Name & Arguments | Return | Description |
---|---|---|
mozCurrentSampleOffset() |
unsigned long long |
Indicates the current offset of the audio stream that was created by a call to mozWriteAudio() . This offset is specified as the number of samples since the beginning of the stream. |
|
void |
Sets up the audio stream for writing. You specify as parameters the number of channels (1 for mono or 2 for stereo), then the sampling rate (44100 for 44.1kHz, for example). |
mozWriteAudio(in jsval data) |
unsigned long |
Writes audio into the stream at the current offset. Returns the number of bytes actually written to the stream. |
Examples
Basic usage
You can create your HTMLAudioElement
entirely with JavaScript:
var horn = new Audio('car_horn.wav'); horn.play();
Some of the more commonly used properties of the audio element includes src
, currentTime
, duration
, paused
, muted
and volume
. This snippet copies the audio file's duration to a variable:
var horn = new Audio('car_horn.wav'); horn.addEventListener('loadeddata', () => { let duration = horn.duration; // The duration variable now holds the duration (in seconds) of the audio clip })
Specifications
Specification | Status | Comment |
---|---|---|
HTML Living Standard The definition of 'HTMLAudioElement' in that specification. |
Living Standard | |
HTML5 The definition of 'HTMLAudioElement' in that specification. |
Recommendation |
Browser compatibility
Desktop | Mobile | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Basic support | Chrome Full support Yes | Edge Full support Yes | Firefox Full support 3.5 | IE Full support 9 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 4 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
mozCurrentSampleOffset | Chrome No support No | Edge No support No | Firefox Full support 4 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Edge Mobile No support No | Firefox Android Full support Yes | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
mozSetup | Chrome No support No | Edge No support No | Firefox Full support 4 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Edge Mobile No support No | Firefox Android Full support Yes | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
mozWriteAudio | Chrome No support No | Edge No support No | Firefox Full support 4 | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Edge Mobile No support No | Firefox Android Full support Yes | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No |
Legend
- Full support
- Full support
- No support
- No support
- Non-standard. Expect poor cross-browser support.
- Non-standard. Expect poor cross-browser support.
- Deprecated. Not for use in new websites.
- Deprecated. Not for use in new websites.
See also
- HTML element implementing this interface:
<audio>
.