Javascript 动态创建的HTML5音频在某些浏览器中无法播放？

我正在用JavaScript创建一个音频元素，然后将其附加到文档中。我也通过JavaScript控制它。它可以在Firefox、Chrome和Opera中正常工作，但在IE和Safari上则不行。在这两个浏览器中，audio元素的readyState从不从0更改，也不会触发任何关联事件。这是我的基本程序：

var init = function() {
    var audioElement = createAudioElement();        
    audioElement.addEventListener('canplay', function() {
        audioElement.play();
        trace(audioElement.readyState);
    }, false);
    document.body.appendChild(audioElement);
    //audioElement.play();  
}

var createAudioElement = function() {
    var m4a = 'song.m4a';
    var ogg = 'song.ogg';

    var m4aSrc = document.createElement('source');
        m4aSrc.setAttribute('src', m4a);
        m4aSrc.setAttribute('type', 'audio/mp4');
    var oggSrc = document.createElement('source');
        oggSrc.setAttribute('src', ogg);
        oggSrc.setAttribute('type', 'audio/ogg');
    var audioEle = document.createElement('audio');
        audioEle.setAttribute('preload', 'preload');
        audioEle.appendChild(m4aSrc);
        audioEle.appendChild(oggSrc);

    return audioEle;
}

---

我知道这有点晚了，但仍然； 我设法在所有这些浏览器上播放音频（IE<9除外），而不附加DOM。您可以使用以下内容创建音频：

var audios = {};
audios['audioIDorName'] = new Audio('pathToYourAudio');   // create audio element
audios['audioIDorName'].load();                           // force load it
audios['audioIDorName'].addEventListener('canplaythrough', audioLoaded, false); // add event for when audio is fully loaded

然后创建audioLoaded（）函数，该函数检查何时加载所有音频（例如，如果您在循环中或一个接一个地添加了多个音频）

var audiosLoaded = 0
function audioLoaded(){ 
    audiosLoaded++;
    console.log("Loaded "+this.src);
    // here you can check if certain number of audios loaded and/or remove eventListener for canplaythrough
    audios['audioIDorName'].removeEventListener('canplaythrough', audioLoaded, false);       
}

然后使用以下功能操作音频：

audios['yourAudioIDorName'].pause();
audios['yourAudioIDorName'].currentTime = 0; // pause() and currentTime = 0 imitate stop() behaviour which doesn't exist ...
audios['yourAudioIDorName'].play();

这对我有用

如果坚持将音频元素附加到DOM，也可以尝试将音频元素附加到现有元素。请参阅更多详细信息

---

不幸的是，考虑到跨浏览器使用，html5音频仍存在许多其他问题。编解码器只是一件事；使用ogg+mp3可能是必要的。Flash回退不是像和这样的库/API使用的整洁解决方案。还有哪些可能是最好的尝试。也请参见我的so。

可能是因为ie<10不支持音频元素？SoundJS的可能副本是一个很好的解决方案，可以为您解决许多问题，但我在处理它时可能会有偏见。您还可以查看中的代码，以获取如何创建和播放动态html音频标记的示例。