Question

我确信在过去我访问过音频元素，我知道这是一种有效的使用方法。但我不明白为什么这次它不起作用!!!我究竟做错了什么？（我正在使用firefox）

调用以下代码有什么问题？

<html>
<head>
<script>
<!-- var audio = new Audio(); audio.src = 'sounds/audio1_1.mp3'; audio.controls = true; audio.loop = true; audio.autoplay = true; -->
var audioElement_theme;
audioElement_theme = document.getElementById("audio1_1");
audioElement_theme.play();
</script>
</head>
<body>
<audio id="audio1_1"><source src="sounds/audio1_1.ogg" type="audio/ogg" /><source src="sounds/audio1_1.mp3" type="audio/mpeg" />Your browser does not support the audio element.</audio>
<div id="mp3_player">
  <div id="audio_box"></div>
  <canvas id="analyser_render"></canvas>
</div>
</body>
</html>

但是当我改变时：

audioElement_theme = document.getElementById("audio1_1");
audioElement_theme.play();

为：

var audio = new Audio(); 
audio.src = 'sounds/audio1_1.mp3'; 
audio.controls = true; 
audio.loop = true; 
audio.autoplay = true;

它有效!!!

Answer 1

当您尝试通过其ID获取该元素时，该元素不存在。

移动脚本使其位于音频元素之后。

您还在脚本中包含HTML注释。这也可能会产生干扰。

JavaScript评论看起来：

// like this

或

/* like this */

Answer 2

你的代码有效，我测试了它。运行当前代码时，它会在控制台窗口中出现错误，如＆＃34;无法读取属性.paly（）的null＆＃34;所以在音频标签后移动你的脚本。所以只需在标记后移动代码。

HTML5 getElementById不能使用Firefox

2 个答案: