h5 audio 和 video

html5音頻和視頻的用法

音頻標籤audio和視頻標籤video用法和其餘html標籤同樣，如：

<audio controls src="johann_sebastian_bach_air.mp3"></audio>

可是因爲各個瀏覽器支持的編解碼器不同，因此能夠配合source來兼容，如：

<video controls>
    <source src="Intermission-Walk-in.ogv"></source>
    <source src="Intermission-Walk-in_512kb.mp4"></source>
</video>

上述代碼的意思就是，若是瀏覽器支持ogv格式就用ogv格式的，不支持就用MP4。

 

audio和video中的媒體元素：

controls : 顯示或隱藏用戶控制界面

autoplay : 媒體是否自動播放

loop : 媒體是否循環播放

currentTime : 開始到播放如今所用的時間

duration : 媒體總時間(只讀)

volume : 0.0-1.0的音量相對值

muted : 是否靜音

autobuffer : 開始的時候是否緩衝加載，

autoplay的時候，忽略此屬性

 

paused : 媒體是否暫停(只讀)

ended : 媒體是否播放完畢(只讀)

error : 媒體發生錯誤的時候，返回錯誤代碼 (只讀)

currentSrc : 以字符串的形式返回媒體地址(只讀)

除了以上屬性以外，video還有幾個特性：

poster : 視頻播放前的預覽圖片

width、height : 設置視頻的尺寸

videoWidth、 videoHeight : 視頻的實際尺寸(只讀)

 

還有三個方法：

play() : 媒體播放

pause() : 媒體暫停

load() : 從新加載媒體（當改變了標籤的src的時候，須要從新加載才能生效）

 

相關事件名稱：（感受用的也很少，只能用的時候再去查了）

loadstart  progress  suspend  emptied stalled play pause loadedmetadata loadeddata waiting playing canplay canplaythrough seeking seeked timeupdate ended ratechange durationchange volumechange

另外canvas的drawImage方法的第一個參數也能夠是視頻！