HTML5页面中播放视频或音频的代码
在HTML5中,新增了两个元素——video元素与audio元素,其中video元素专门用来播放网络上的视频或电影,而audio元素专门用来播放网络上的音频数据。使用这两个元素,就不再需要使用其他任何插件了,只要使用支持HTML5的浏览器就可以了,同时在开发的时候也不再需要书写复杂的object元素和embed元素了。
现在,safari3以上、firefox4以上、opera 10以上,以及google chrome 3.0以上的浏览器都实现了对于video元素与audio元素的支持。
这两个元素的使用方法都很简单,首先以audio元素为例,只要把播放视频的URL地址指定给该元素的src属性就可以了。如下所示:
<audio src="http://www.auuo.com/html5.mp3">(注释:网址格式写成****.mp3)
您的浏览器不支持audio元素
</audio>
通过这种方法,可以把指定的音频数据直接嵌入在网页上,其中“您的浏览器不支持audio元素”为在不支持audio元素的浏览器中所显示的替代文字。
video元素的使用方法也很简单,只要设定好元素的长、宽等属性,并且把播放视频的URL地址指定给该元素的src属性就可以了,如下:
<video width="60" height="360" src="http://www.auuo.com/html5.mp4">(注释:网址写成.mp4)
您的浏览器不支持video元素
</video>
另外,你还可以通过source元素来为同一个媒体数据指定多个播放格式与编码方式,以确保浏览器可以从中选择一种自己支持的播放格式进行播放,浏览器的选择吮吸为代码中的书写顺序,它会从上往下判断自己对该播放格式是否支持,知道选择到自己支持的播放格式位置。source元素的使用方法如下所示。
<video>
<!-在Ogg theora格式、Quicktime格式与mp4格式之间,挑选自己支持的播放格式-->
<source src='sample.ogv' type='video/ogg; codecs="theora,vorbis"'>
<source src='sample.mov' type='video/quicktime'>
</video>