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

标签 javascript html mobile html5-canvas html5-audio

我正在尝试在 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 的最佳实践???

最佳答案

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

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

关于javascript - 调用音频元素在 html5 中播放的更快方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14032412/

相关文章:

ios - TensorFlow for Mobile Poets x86_64编译失败

asp.net - 如何修复移动应用中的服务器错误 500 Web api

javascript - 在 JavaScript 中显示未知名称时出错

css - 如何将两个 DIV 放置在水平固定标题内并使所有内容垂直对齐?

html - 通过符号或 css 包含内联 svg?

javascript - 如何检测用户使用的是手机、平板电脑还是台式机并重定向他们?

javascript - 将 ng-repeat 项传递给 Controller ​​中的范围变量

javascript - 使用 Angular 2 的 http.get() 从本地文件加载 json

javascript - 使用 Django 打开社交登录的新窗口,然后关闭并返回父窗口

html - 在 div 中垂直对齐文本和图像