在网页中嵌入HTML5音频播放器和视频播放器的方法非常简单：
前面的示例演示了如何播放视频文件并显示视频播放控制按钮。
下面的示例是如何在 HTML 页面中嵌入音频：
这里的src属性可以填写音频/视频URL，也可以填写本地文件。
以下是 和 两个标签上的控件属性的含义：
控件：显示标准 HTML5 视频/音频播放器控制栏和控制按钮。
自动播放：让文件手动播放。
循环：让文件循环播放。
这里的preload属性是用来缓存大容量文件的。 它有三个可选值：
“none”不缓存
“自动”缓存
“metadata”仅缓存文件元信息
为了兼容各种浏览器对不同媒体类型的支持mp3播放器 html5，我们可以使用多个元素来提供多种不同的媒体类型。 例如：
支持 Ogg 格式视频流的浏览器可以播放 Ogg 文件。 如果不支持，则可以播放 MPEG-4 文件。 要检查各种浏览器对各种媒体类型的支持，请查看此处。
我们还可以指定播放时使用的编解码器（codecs）； 这将使浏览器能够更精确地播放提供的视频：
在里面，我们指定该视频需要使用 Dirac 和 Speex 解码器。 如果浏览器支持 Ogg 格式，但未指定编解码器，则不会加载视频。
如果没有提供type属性，浏览器会向服务器询问媒体类型，看是否支持； 如果没有，浏览器将检查下一个源属性。
使用 JavaScript 控制视频/音频播放
一旦视频文件正确嵌入到 HTML 页面中，我们就可以使用 JavaScript 部分来控制它并获取其播放信息。 例如，要使用 JavaScript 开始视频播放：
var v = document.getElementsByTagName("video")[0];
v.play();
使用JavaScript控制HTML5视频播放器实现播放、暂停、快进、快退、音量等。
停止下载视频文件
事实上，我们可以使用pause()方法来停止视频文件的播放，但是浏览器不会停止下载媒体文件，除非达到一定的缓存量。
以下是阻止浏览器下载视频文件的方法：
var mediaElement = document.getElementById("myMediaElementID");
mediaElement.pause();
mediaElement.src='';
//或
mediaElement.removeAttribute("src");
通过删除src属性（或将其设置为空值），可以停止文件的网络下载。
设置播放时间点定位
我们可以指定视频从某个时间、某分钟、某秒开始播放，这是通过设置currentTime属性来实现的。
我们可以通过seekable属性获取视频的有效播放时间范围。 它将返回一个 TimeRanges 对象来告诉您有效的开始和结束时间。
var mediaElement = document.getElementById('mediaElementID');
mediaElement.seekable.start(0); // 返回开始时间 (秒)
mediaElement.seekable.end(0); // 返回结束时间 (秒)
mediaElement.currentTime = 122; // 定位到第 122 秒播放
mediaElement.played.end(0); // 返回已经播放的时间长度(秒)
设置播放范围
当在网页中嵌入视频/音频文件时， or 元素允许我们提供一些附加信息来指定播放哪个时间段。 这是通过在媒体文件前面添加尾迹（“#”）形式的信息来实现的。
其具体句型如下：
#t=[开始时间][,结束时间]
时间可以用秒表示，也可以用“时:分:秒”的格式表示（如2:05:01）。 /p>
例子：
//www.laike.net/video.ogg#t=10,20
指定视频在 10 秒开始播放并在 20 秒结束。
//www.laike.net/video.ogg#t=,10.5
指定视频从开始播放到 10.5 秒。
//www.laike.net/video.ogg#t=,02:00:00
指定视频播放 2 小时。
//www.laike.net/video.ogg#t=60
指定视频从第60秒开始播放，一直播放到结束。
设置视频封面（海报参数）
当不手动播放视频时，在某些浏览器中，视频播放前的默认界面是空白的，毫无意义。 我们可以为视频设置一个封面，使用视频中具有代表性的屏幕截图作为视频的封面，设置视频封面的参数为海报：
视频加载遇到错误时的补救措施
有时视频资源会无效，或者无法加载，或者浏览器无法解码当前的视频格式。 遇到这些情况，我们应该采取补救措施，替换当前的视频资源地址，或者使用其他措施来补救，比如用图片替换视频对象。 我们可以使用JavaScript来监听视频加载中的“错误”事件mp3播放器 html5，例如下面的视频资源：
我们使用如下js代码来补救：
var v = document.querySelector('video'),
sources = v.querySelectorAll('source'),
lastsource = sources[sources.length-1];
lastsource.addEventListener('error', function(ev) {
var d = document.createElement('div');
d.innerHTML = v.innerHTML;
v.parentNode.replaceChild(d, v);
}, false);
更多关于HTML5视频播放器video标签和音频播放器audio标签的正确使用方法，请点击查看下面相关文章
