Different Ways to Play a Sound from a Web Page

Back to menu

10. Using the HTML5 <AUDIO> tag

Finally, in the latest version of the HTML standard, comes support for embedded audio files. You would think the <AUDIO> tag would solve all the problems wouldn't you? Well browsers still vary in terms of which file formats they support, and buffering is still not as good as it might be.

To include an audio player using the <AUDIO> tag:

<audio id="audio1" src="success.wav" controls preload="auto" autobuffer>
</audio>

If you want to play the audio from a script, use:

<script>
function EvalSound(soundobj) {
  var thissound=document.getElementById(soundobj);
  thissound.play();
}
</script>

Say triggered by a button:

<form>
<input type="button" value="Play Sound" onClick="EvalSound('audio1')">
</form>

Compatibility: Internet Explorer, Firefox, Opera, Chrome.

In Internet Explorer, support for the HTML 5 AUDIO element started in version 9.