HTML5多媒体的简述

在HTML5出现之前，要在网络上展示视频、音频、动画，除了使用第三方自主开发的播放器之外，使用得最多的工具应该是Flash了，但是它们都需要在浏览器中安装相应插件才能使用，但是有时速度很慢。HTML5的出现解决了这个问题。在HTML5中，提供了音频、视频的标准接口，通过HTML5中的相关技术，播放视频、动画、音频等多媒体再也不需要安装插件，只要使用支持HTML5的浏览器就可以了。

 

HTML5与HTML4的多媒体相比较

在HTML5之前，如果开发者想要在Web页面中加入视频，必须使用object和embed元素，而且还要为这两个元素添加许多属性和参数。在HTML4中多媒体的应用代码如下。

<object width="425" height="344">

<param name="movie" value="http://www.mingribok.com" />

<param name="allowFullScreen" value="true" />

<param name="aiiowscriptaccess" value="always" />

<embed src="http://www.mingribok.com"

type="application/x-shockwave-flash"

allowscriptaccess="always"

allowFullScreen="ture" width="425" height="344">

</embed>

</object>

从上面的代码可以看出，在HTML4中使用多媒体有如下缺点。

　代码冗长而笨拙。

　需要使用第三方插件（flash）。如果用户没有安装flash插件，则不能播放视频，画面上也会出现一片空白。

在HTML5中，新增了两个元素——video元素与audio元素。video元素专门用来播放网络上的视频或电影，而audio元素专门用来播放网络上的音频数据。使用这两个元素，就不再需要使用其他插件了，只要使用支持HTML5的浏览器就可以了

目前浏览器对video元素与audio元素的支持情况

这两个元素的使用方法都很简单，首先以audio元素为例，只要把播放音频的URL给指定元素的src属性就可以了。audio元素使用方法如下。

<audio src="http://mingri/demo/test.mp3">

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

</audio>

通过这种方法，可以把指定的音频数据直接嵌入在网页上，其中“您的浏览器不支持audio元素！”为在不支持audio元素的浏览器中所显示的替代文字。

video元素的使用方法也很简单，只要设定好元素的长、宽等属性，并且把播放视频的URL地址指定给该元素的src属性就可以了。video元素的使用方法如下。

<video width="640" height="360" src=" http://mingri/demo/test.mp3">

您的浏览器不支持video 元素！

</video>

还可以通过使用source元素来为同一个媒体数据指定多个播放格式与编码方式，以确保浏览器可以从中选择一种自己支持的播放格式进行播放，浏览器的选择顺序为代码中的书写顺序，它会从上往下判断自己对该播放格式是否支持，直到选择到自己支持的播放格式为止。