javascript - 调用音频元素在 html5 中播放的更快方法

Question

我正在尝试在 HTML5 手机游戏中使用音频元素。我对音效有一些问题，所以我在游戏开始时多次克隆音频元素，如下所示:

for (var i=0; i < 10; i++)
        {
            var container = document.getElementById("audioDiv");
            var clone = document.getElementById('multiaudio0').cloneNode(true);
            clone.setAttribute('id',"multiaudio" + i);
            container.appendChild (clone);
        };

然后当我需要“碰撞”使用它时，我将其称为 NEXT :

document.getElementById('audioDiv').getElementsByTagName("audio")[score%10].play();

问题是调用元素并播放时速度非常慢并且减慢了 Canvas 上的动画!!!!有时它也不起作用!!!

关于 HTML5 移动游戏声音(无 Flash)的任何想法，或者快速调用元素而不是 document.getElementById 的最佳实践？？？

Answer 1

我建议在调用之前预先定义一个包含指向各种音频元素的指针的数组(而不是重复 document.getElementById('audioDiv').getElementsByTagName("audio") 多次查找另请确保您已预加载音频样本，以便将它们缓存起来，并且您在第一次需要它们时无需等待网络资源

如果您正在开发基于 HTML5 的游戏，我建议您查看一下 EaselJS 框架，尤其是 SoundJS 部分... http://www.createjs.com/#!/SoundJS