在HTML5中的音視頻標(biāo)簽的屬性也不是很多剑肯，w3school有很詳細(xì)的講解。
主要是在JS中我們應(yīng)該如何去控制音視頻的狀態(tài)观堂。以下屬性和方法相信大家都會(huì)用的到让网。
<audio> 標(biāo)簽屬性：
<ul><li>src：音樂的URL
<li>preload：預(yù)加載
<li>autoplay：自動(dòng)播放
<li>loop：循環(huán)播放
<li>controls：瀏覽器自帶的控制條
</ul>
<video> 標(biāo)簽屬性：
<ul><li>src：視頻的URL
<li>poster：視頻封面呀忧，沒有播放時(shí)顯示的圖片
<li>preload：預(yù)加載
<li>autoplay：自動(dòng)播放
<li>loop：循環(huán)播放
<li>controls：瀏覽器自帶的控制條
<li>width：視頻寬度
<li>height：視頻高度
</ul>
獲取HTMLMediaElements對(duì)象
<ol>
<li>var media = new Audio(http://www.test.com/test.mp3);
<li>var media = document.getElementsbyId("media");(引號(hào)內(nèi)的media是你音視頻標(biāo)簽的id值)
</ol>
瀏覽器兼容影音格式
| 瀏覽器、影音格式 | Ogg Theora | MP4(H.264) | WebM |
|---|---|---|---|
| Microsoft Internet Explorer9 | × | √ | × |
| Mozilla Firefox5+ | √ | × | √ |
| Google Chrome13+ | √ | √ | √ |
| Apple Safari5+ | × | √ | × |
| Opera11+" | √ | × | √ |
重點(diǎn)來了＠６谩６恕！ 以下JS部分有需要收藏的趕緊拿走~<code>
<ol><li>//錯(cuò)誤狀態(tài)
<li> Media.error; //null:正常
<li> Media.error.code; //1.用戶終止 2.網(wǎng)絡(luò)錯(cuò)誤 3.解碼錯(cuò)誤 4.URL無效
<li>//網(wǎng)絡(luò)狀態(tài)
<li> Media.currentSrc; //返回當(dāng)前資源的URL
<li> Media.src = value; //返回或設(shè)置當(dāng)前資源的URL
<li> Media.canPlayType(type); //是否能播放某種格式的資源
<li> Media.networkState; //0.此元素未初始化 1.正常但沒有使用網(wǎng)絡(luò) 2.正在下載數(shù)據(jù) 3.沒有找到資源
<li> Media.load(); //重新加載src指定的資源
<li> Media.buffered; //返回已緩沖區(qū)域因篇，TimeRanges
<li> Media.preload; //none:不預(yù)載 metadata:預(yù)載資源信息 auto:
<li>//準(zhǔn)備狀態(tài)
<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>//回放狀態(tài)
<li> Media.currentTime = value; //當(dāng)前播放的位置泞辐，賦值可改變位置
<li> Media.startTime; //一般為0，如果為流媒體或者不從0開始的資源竞滓，則不為0
<li> Media.duration; //當(dāng)前資源長(zhǎng)度 流返回?zé)o限
<li> Media.paused; //是否暫停
<li> Media.defaultPlaybackRate = value;//默認(rèn)的回放速度咐吼，可以設(shè)置
<li> Media.playbackRate = value;//當(dāng)前播放速度，設(shè)置后馬上改變
<li> Media.played; //返回已經(jīng)播放的區(qū)域商佑，TimeRanges锯茄，關(guān)于此對(duì)象見下文
<li> Media.seekable; //返回可以seek的區(qū)域 TimeRanges
<li> Media.ended; //是否結(jié)束
<li> Media.autoPlay; //是否自動(dòng)播放
<li> Media.loop; //是否循環(huán)播放
<li> Media.play(); //播放
<li> Media.pause(); //暫停
<li>//控制
<li> Media.controls;//是否有默認(rèn)控制條
<li> Media.volume = value; //音量
<li> Media.muted = value; //靜音
<li> //TimeRanges(區(qū)域)對(duì)象
<li> TimeRanges.length; //區(qū)域段數(shù)
<li> TimeRanges.start(index) //第index段區(qū)域的開始位置
<li> TimeRanges.end(index) //第index段區(qū)域的結(jié)束位置
</ol>
以下轉(zhuǎn)自http://www.cnblogs.com/luckk/p/5239991.html，歡迎大家探討交流
