html5 音频

版本：HTML5

HTML5 提供了播放音频文件的标准，即使用 元素，在一个支持HTML5的浏览器中，不需要安装任何插件就能播放音频，原生的支持音频，为HTML5注入了巨大的发展潜力。

HTML5中播放音频

HTML5中播放音频。使用标签和标签来实现。

• 标签可以插入音频，用来设置声音内容。
• control属性，则向用户显示控件，比如播放按钮。可以控制音频的播放，暂停，调节音量等。
• autoplay属性规定一旦音频就绪马上开始播放，如果设置了该属性，视频将自动播放。且所有主流浏览器都支持 autoplay 属性。
• loop属性，则每当音频结束时重新开始播放。
• preload属性，则音频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。
• width宽度和height，可以根据需要需要来设置音频的显示。

• 标签用于设置音频的资源，可以使用多个。
• src属性，要播放的音频的 URL。

 您的浏览器不支持 audio 元素。 

效果

效果

• 如果你准备使用HTML5的音频: ogg (ogg, oga), mp3, wav, AAC。
• 对于 低于IE9 和旧浏览器，你将需要一个折衷的解决方案。

当你第一次尝试 HTML5 的音频/视频，你的服务器必须支持你打算提供的音频/视频的 MIME 格式。你将需要检查一下其在本地服务器上是否被支持。

如果你使用 Safari 来检测 HTML5 的音频/视频支持，需要安装 QuickTime Player，没有QuickTime Player 的 Safari 什么都不能播放。

浏览器支持

音频格式

• ogg[ogg, oga]。Ogg全称应该是OGGVobis(oggVorbis)是一种新的音频压缩格式，类似于MP3等的音乐格式。Ogg是完全免费、开放和没 有专利限制的。OggVorbis文件的扩展名是.OGG。Ogg文件格式可以不断地进行大小和音质的改良，而不影响旧有的编码器或播放器。
• mp3。MP3是一种音频压缩技术，其全称是 动态影像专家压缩标准音频层面3（Moving Picture Experts Group Audio Layer III），简称为MP3。 它被设计用来大幅度地降低音频数据量。利用 MPEG Audio Layer 3 的技术，将音乐以1:10 甚至 1:12 的压缩率，压缩成容量较小的文件，而 对于大多数用户来说重放的音质与最初的不压缩音频相比没有明显的下降。它是在1991年由位于德国埃尔朗根的研究组织Fraunhofer-Gesellschaft 的一组工程师发明和标准化的。用MP3形式存储的音乐就叫作MP3音乐，能播放MP3音乐的机器就叫作MP3播放器。
• wav。WAV为微软公司(Microsoft)开发的一种声音文件格式，它符合RIFF(Resource Interchange File Format)文件规范，用于保存Windows平台的音 频信息资源，被Windows平台及其应用程序所广泛支持，该格式也支持MSADPCM，CCITT A LAW等多种压缩运算法，支持多种音频数字，取样频率和 声道，标准格式化的WAV文件和CD格式一样，也是44.1K的取样频率，16位量化数字，因此在声音文件质量和CD相差无几！ WAV打开工具是WINDOWS 的媒体播放器。
• aac。AAC（Advanced Audio Coding），中文称为“高级音频编码”，出现于1997年，基于 MPEG-2的音频编码技术。由Fraunhofer IIS、杜比实验室 、AT&T、Sony（索尼）等公司共同开发，目的是取代MP3格式。2000年，MPEG-4标准出现后，AAC 重新集成了其特性，加入了SBR技术和PS技术， 为了区别于传统的 MPEG-2 AAC 又称为 MPEG-4 AAC。

HTML4中播放音频

HTML5未出来之前，在线的音频和视频都是借助Flash或者第三方工具实现的。插件的功能是扩展 HTML 浏览器的功能。辅助应用程序（helper application）是可由浏览器启动的程序。辅助应用程序也称为插件。辅助程序可用于播放音频和视频（以及其他）。辅助程序是使用标签来加载的。

• 不同的浏览器对音频格式的支持也不同。
• 如果浏览器不支持该文件格式，没有插件的话就无法播放该音频。
• 如果用户的计算机未安装插件，无法播放音频。
• 如果把该文件转换为其他格式，仍然无法在所有浏览器中播放。

使用辅助程序播放视频和音频的一个优势是，您能够允许用户来控制部分或全部播放设置。插件可以通过标签或者标签添加在页面中。大多数辅助应用程序允许对音量设置和播放功能（比如后退、暂停、停止和播放）的手工（或程序的）控制。

所有主流浏览器都支持标签。元素定义了在 HTML 文档中嵌入的对象。该标签用于插入对象 (例如在网页中嵌入 Java 小程序, PDF 阅读器, Flash 播放器) 。

元素同样可用于包含HTML文件：

元素同样可用于插入一张图片:

所有主流浏览器都支持元素。元素表示一个 HTML Embed 对象 。元素已经出现很长一段时间了，但是在 html5 前并为被详细说明，该元素在 HTML 5 页面上会被验证，在 HTML 4 上不会。标签在 HTML 4 中是无效的。页面无法通过 HTML 4 验证(W3C验证）。

注意 元素没有关闭标签。 不能使用替代文本。

元素同样可用于包含HTML文件：

元素同样可用于插入一张图片:

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com