检查是否有任何音频与JS播放-DEV365 开发者社区

检查是否有任何音频与JS播放

作为软件开发人员，您可能会遇到需要检查当前是否在网页上播放的音频的情况。无论是用于添加自定义控件还是实施特定的行为，具有检测音频播放的能力都非常有用。在本文中，我们将探讨如何使用JavaScript实现此目标。

通过利用HTML5音频元素提供的HTMLAudioElement接口来确定音频是否播放的直接方法。该接口公开了与网页上音频元素交互的各种属性和方法。

要检查当前是否在播放任何音频，我们可以迭代页面上存在的所有音频元素并检查其paused属性。如果任何音频元素具有paused的false值，则意味着音频正在积极播放。

const isAnyAudioPlaying = () => {
  const audioElements = document.getElementsByTagName('audio');

  for (let i = 0; i < audioElements.length; i++) {
    if (!audioElements[i].paused) {
      return true;
    }
  }

  return false;
};

if (isAnyAudioPlaying()) {
  console.log("Audio is playing! 🎵");
} else {
  console.log("No audio playing at the moment. 🤫");
}

在上面的代码段中，我们定义了一个称为isAnyAudioPlaying的函数，该函数使用getElementsByTagName('audio')检索所有音频元素。然后，我们遍历每个音频元素，并检查其paused属性是否为false。如果我们在paused中找到任何音频元素为false，则返回true，指示音频正在播放。否则，我们返回false。

要演示用法，我们将isAnyAudioPlaying函数称为控制台。

使用此简单的JavaScript功能，您可以轻松地检查是否在网页上播放任何音频并相应地执行操作。因此，继续，添加一些时髦的音频控件或基于音频播放的交互式体验！

！

检查是否有任何音频与JS播放

参考：