我无法使用 var audio=new Audio("Audio track"); 方法播放音频音频播放（）答案

【问题标题】：I can't play audio using the method var audio=new Audio("Audio track"); audio.play()我无法使用 var audio=new Audio("Audio track"); 方法播放音频音频播放（）
【发布时间】：2020-07-08 12:59:00
【问题描述】：

所以我是 Java 脚本的新手，每当我尝试使用 Java 脚本播放音频文件时，我都会收到错误消息：

加载资源失败：net::ERR_FILE_NOT_FOUND
未捕获（承诺中）DOMException：加载失败，因为找不到支持的源。

如果有人可以帮助我，请。我的java脚本文件如下。

for (var i = 0; i < document.querySelectorAll(".drum").length; i++) {
  document.querySelectorAll(".drum")[i].addEventListener("click", function() {
    var audio = new Audio("C:\Users\User\Web_Developement\Drum Kit\sounds\crash.mp3");
    audio.play();
  })
}

还有我的 index.html 文件。

<head>
  <meta charset="utf-8">
  <title>Drum Kit</title>
  <link rel="stylesheet" href="styles.css">
  <link href="https://fonts.googleapis.com/css?family=Arvo" rel="stylesheet">
</head>

<body>

  <h1 id="title">Drum ???? Kit</h1>
  <div class="set">
    <button class="w drum">w</button>
    <button class="a drum">a</button>
    <button class="s drum">s</button>
    <button class="d drum">d</button>
    <button class="j drum">j</button>
    <button class="k drum">k</button>
    <button class="l drum">l</button>
  </div>


  <footer>
    Made with ❤️ in London.
  </footer>
</body>
<script src="C:\Users\User\Web_Developement\Drum Kit\index.js" charset="utf-8"></script>

</html>

【问题讨论】：

你应该设置一个Web服务器（如wamp），有很多东西在处理本地文件时不起作用
帮自己一个忙，运行本地服务器。在浏览器中运行文件协议并不是最好的选择。

标签： javascript html

【解决方案1】：

使用音频源文件的相对路径对我有用：

for (var i = 0; i < document.querySelectorAll(".drum").length; i++) {
  document.querySelectorAll(".drum")[i].addEventListener("click", function() {
    var audio = new Audio("sounds/crash.mp3");
    audio.play();
  })
}

这是因为在浏览器中运行的 javascript 实例并不意味着访问用户的本地文件。您可以通过从本地网络服务器运行您的网站来避免此类错误，以便在测试和尝试仅使用相对路径时正确分离服务器端文件和客户端文件。

【讨论】：