WEB技术分享

WEB中的Audio标签

HTML5定义了一个新的元素用来指定标准的方式来插入音频文件到web页面中：<audio>标签。使用audio标签可以控制音频的播放与停止，循环播放与播放次数设置，以及播放位置等等，详情请看下表。

目前支持audio标签的浏览器有：

IE9，Firefox， Opera，Chrome和Safari都支持<audio>标签。

注意：IE8和更早的版本，不支持<audio>标签。

如何使用Audio

要在HTML5中播放音频，需要在body中插入以下代码：

<audio controls="controls"> 
   <source src="music.ogg" />
   <source src="music.mp3" />
   <source src="music.wav" />
</audio>

你可以在<audio>和</audio>标签之间插入文字内容，这样如果浏览器不支持audio，那么会显示这些文字。

也许你会问auto中怎么会包含3个source标签呢？这是为了浏览器和音频格式的兼容性，浏览器制造商并非都同意使用某一种音频文件格式。例如，Chrome、Internet Explorer 9 (IE9) 和 Safari 浏览器不支持 WAV 文件，这是一种使用非压缩格式且正在衰败的标准。我们将每个视频文件名放在单独的 <source> 标签里，并且音频容器中的所有源标签都由<audio></audio> 构成，如下所示。那么，无论访问者使用什么浏览器，它都将自动选择所读取的第一个文件类型，并为您播放声音。

HTML5浏览器和音频格式兼容性

此外，不同浏览器音频空间外观也不一样。

HTML5 让开发人员可以更轻松地提供大量WEB体验。<audio>标签是令人兴奋的新添内容，不再需要外部音乐播放器，使音频的提供像显示图像一样简单。有了基于标准的音频控件和让用户更易于与声音进行交互的新浏览器功能，你可以轻松的在WEB页面上定制MP3播放器了。