在HTML5中的音视频标签的属性也不是很多，w3school有很详细的讲解。
主要是在JS中我们应该如何去控制音视频的状态。以下属性和方法相信大家都会用的到。
<audio> 标签属性：
<ul><li>src：音乐的URL
<li>preload：预加载
<li>autoplay：自动播放
<li>loop：循环播放
<li>controls：浏览器自带的控制条
</ul>
<video> 标签属性：
<ul><li>src：视频的URL
<li>poster：视频封面，没有播放时显示的图片
<li>preload：预加载
<li>autoplay：自动播放
<li>loop：循环播放
<li>controls：浏览器自带的控制条
<li>width：视频宽度
<li>height：视频高度
</ul>
获取HTMLMediaElements对象
<ol>
<li>var media = new Audio(http://www.test.com/test.mp3);
<li>var media = document.getElementsbyId("media");(引号内的media是你音视频标签的id值)
</ol>
浏览器兼容影音格式
| 浏览器、影音格式 | Ogg Theora | MP4(H.264) | WebM |
|---|---|---|---|
| Microsoft Internet Explorer9 | × | √ | × |
| Mozilla Firefox5+ | √ | × | √ |
| Google Chrome13+ | √ | √ | √ |
| Apple Safari5+ | × | √ | × |
| Opera11+" | √ | × | √ |
重点来了！！！ 以下JS部分有需要收藏的赶紧拿走~<code>
<ol><li>//错误状态
<li> Media.error; //null:正常
<li> Media.error.code; //1.用户终止 2.网络错误 3.解码错误 4.URL无效
<li>//网络状态
<li> Media.currentSrc; //返回当前资源的URL
<li> Media.src = value; //返回或设置当前资源的URL
<li> Media.canPlayType(type); //是否能播放某种格式的资源
<li> Media.networkState; //0.此元素未初始化 1.正常但没有使用网络 2.正在下载数据 3.没有找到资源
<li> Media.load(); //重新加载src指定的资源
<li> Media.buffered; //返回已缓冲区域，TimeRanges
<li> Media.preload; //none:不预载 metadata:预载资源信息 auto:
<li>//准备状态
<li> Media.readyState; //1:HAVE_NOTHING 2:HAVE_METADATA 3.HAVE_CURRENT_DATA 4.HAVE_FUTURE_DATA 5.HAVE_ENOUGH_DATA
<li> Media.seeking; //是否正在seeking
<li>//回放状态
<li> Media.currentTime = value; //当前播放的位置，赋值可改变位置
<li> Media.startTime; //一般为0，如果为流媒体或者不从0开始的资源，则不为0
<li> Media.duration; //当前资源长度 流返回无限
<li> Media.paused; //是否暂停
<li> Media.defaultPlaybackRate = value;//默认的回放速度，可以设置
<li> Media.playbackRate = value;//当前播放速度，设置后马上改变
<li> Media.played; //返回已经播放的区域，TimeRanges，关于此对象见下文
<li> Media.seekable; //返回可以seek的区域 TimeRanges
<li> Media.ended; //是否结束
<li> Media.autoPlay; //是否自动播放
<li> Media.loop; //是否循环播放
<li> Media.play(); //播放
<li> Media.pause(); //暂停
<li>//控制
<li> Media.controls;//是否有默认控制条
<li> Media.volume = value; //音量
<li> Media.muted = value; //静音
<li> //TimeRanges(区域)对象
<li> TimeRanges.length; //区域段数
<li> TimeRanges.start(index) //第index段区域的开始位置
<li> TimeRanges.end(index) //第index段区域的结束位置
</ol>
以下转自http://www.cnblogs.com/luckk/p/5239991.html，欢迎大家探讨交流
