How can I add multiple sources to an HTML5 audio tag, programmatically?

A lot of examples demonstrate multiple source tags nested in the audio tag, as a method to overcome codec compatibility across different browsers. Something like this -

<audio controls="controls">
  <source src="song.ogg" type="audio/ogg" />
  <source src="song.mp3" type="audio/mpeg" />
  Your browser does not support the audio element.
</audio>

While with JavaScript, I'm also allowed to create an audio element like this -

var new_audio = document.createElement("audio");

Where I can set its source by the .src property - new_audio.src="....";

I failed to find how to add multiple sources in an audio element through JavaScript, something similar to source tags shown in the HTML snippet.

Do I manipulate the new_audio and add the tags inside it, just like one would manipulate any other DOM element? I'm doing this right now and it works, which is -

new_audio.innerHTML = "<source src='audio/song.ogg' type='audio/ogg' />";
new_audio.play();

I wonder if there is a more appropriate way to do it?

33
задан robertc 28 October 2011 в 11:47
поделиться