使用HTML播放音频

1. 使用HTML的音频标签

HTML5提供了一个内置的音频标签

其中src属性指定了音频文件的URL，也就是要拿来播放的音频文件。如果你希望为音频文件提供用户界面，可以将controls属性添加到

2. 如何控制音频播放

一旦你添加了

const audio = document.querySelector('audio'); // 获取音频元素
audio.play(); // 播放音频

为了暂停音频，可以调用它的pause()方法：

audio.pause(); // 暂停音频

如果你希望用户通过单击页面上的按钮来控制音频的播放，你可以通过下面的代码实现：

当用户单击这些按钮时，它们会调用

3. 处理音频事件

HTML5的

下面是一些常见的

  • play – 当音频文件开始播放时触发
  • pause – 当音频文件暂停时触发
  • ended – 当音频文件播放结束时触发
  • timeupdate – 当音频文件的播放位置发生变化时触发

要处理这些事件，可以使用addEventListener()方法将eventlistener添加到

const audio = document.querySelector('audio');
audio.addEventListener('play', () => {
  console.log('音频正在播放...');
});

以上代码将在音频开始播放时向控制台输出一个消息。

当然，你可以使用其他JavaScript代码执行任何操作，而不仅仅是打印一条消息。例如，你可以暂停一个正在播放的音频，或在文本框中显示当前的播放位置。