HTMLAudioElement

基线 广泛可用

此功能已得到很好的确立,并且可以在许多设备和浏览器版本中使用。它已在浏览器中可用,自 2015 年 7 月.

HTMLAudioElement 接口提供对 <audio> 元素属性的访问,以及操作它们的 方法。

此元素基于 HTMLMediaElement 接口并继承其属性和方法。

EventTarget Node Element HTMLElement HTMLMediaElement HTMLAudioElement

构造函数

Audio()

创建并返回一个新的 HTMLAudioElement 对象,如果给定文件 URL,则可以选择启动将音频文件加载到其中的过程。

实例属性

没有特定属性;继承自其父级 HTMLMediaElementHTMLElement 的属性。

实例方法

继承自其父级 HTMLMediaElementHTMLElement 的方法。它本身不提供任何方法。

示例

基本用法

您可以使用 Audio() 构造函数完全使用 JavaScript 创建 HTMLAudioElement

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

然后,您可以对元素调用 play() 方法

js
audioElement.play();

注意:一个常见的错误是在页面加载时立即尝试播放音频元素。现代浏览器的默认自动播放策略将阻止这种情况发生。有关最佳实践和解决方法,请参阅 Firefoxchrome

音频元素的一些常用属性包括 srccurrentTimedurationpausedmutedvolume。此代码段将音频文件的持续时间复制到一个变量中

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
});

事件

继承自其父级 HTMLMediaElement 及其祖先 HTMLElement 的方法。 使用 addEventListener() 或通过将事件侦听器分配给此接口的 oneventname 属性来侦听事件。

规范

规范
HTML 标准
# htmlaudioelement

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅