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.

HTMLAudioElement 接口提供对 <audio> 元素的属性访问及一系列操控它的方法,它基于并从 HTMLMediaElement 接口继承属性和方法。

构造函数

Audio()

创建并返回一个新的 HTMLAudioElement 对象,如果提供音频文件 URL,则开始加载音频文件。

属性

没有具体的属性;从父类 HTMLMediaElementHTMLElement 继承属性。

方法

从父类 HTMLMediaElementHTMLElement 继承方法,自身不提供方法。

废弃的且仅适用于 Mozilla 的方法

以下方法是未标准化的,请勿使用.

mozCurrentSampleOffset() 非标准 已弃用

Returns the number of samples form the beginning of the stream that have been written so far into the audio stream created by calling mozWriteAudio().

mozSetup() 非标准 已弃用

Sets up the audio stream to allow writing, given the number of audio channels (1 or 2) and the sample rate in kHz.

mozWriteAudio() 非标准 已弃用

Writes a batch of audio frames to the stream at the current offset, returning the number of bytes actually written to the stream.

示例

基本用法

你可以完全使用 JavaScript 的 Audio() 构造函数来创建一个 HTMLAudioElement

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

然后你可以在这个元素上调用 play() 方法

js
audioElement.play();

备注:一个常见的需求是在页面加载后马上去播放音频,现代浏览器的默认自动播放策略会阻止这一行为,参见 firefoxchrome 寻找最佳实践和解决方案。

一些经常被使用的属性,包括 srccurrentTimedurationpausedmutedvolume。以下这段代码赋值音频文件的播放时长给一个变量:

js
var audioElement = new Audio("car_horn.wav");
audioElement.addEventListener("loadeddata", () => {
  let duration = audioElement.duration;
  // duration 变量现在存放音频的播放时长(单位秒)
});

事件

从父类 HTMLMediaElement 和祖先 HTMLElement 继承方法。使用 addEventListener() 监听事件或者赋值一个事件监听器给这个接口的 oneventname 属性。

规范

Specification
HTML Standard
# htmlaudioelement

浏览器兼容性

BCD tables only load in the browser

参见