html5標(biāo)簽
<video>:Html5提供的播放視頻的標(biāo)簽
src:資源地址
controls:該屬性定義是顯示還是隱藏用戶(hù)控制界面
<audio>:Html5提供的播放音頻的標(biāo)簽
src:資源地址
controls:該屬性定義是顯示還是隱藏用戶(hù)控制界面
<source>
視頻:
type='video/webm; codecs="vp8, vorbis"'
type='video/ogg; codecs="theora, vorbis"'
type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'
音頻:
type='audio/ogg; codecs="vorbis"'
type='audio/aac; codecs="aac"'
type='audio/mpeg'
video標(biāo)簽的屬性
width :視頻顯示區(qū)域的寬度,單位是CSS像素
height :視頻展示區(qū)域的高度幻工,單位是CSS像素
poster :一個(gè)海報(bào)幀的URL励两,用于在用戶(hù)播放或者跳幀之前展示
src : 要嵌到頁(yè)面的視頻的URL
controls : 顯示或隱藏用戶(hù)控制界面
autoplay : 媒體是否自動(dòng)播放
loop : 媒體是否循環(huán)播放
muted : 是否靜音
preload : 該屬性旨在告訴瀏覽器作者認(rèn)為達(dá)到最佳的用戶(hù)體驗(yàn)的方式是什么
none: 提示作者認(rèn)為用戶(hù)不需要查看該視頻,服務(wù)器也想要最小化訪(fǎng)問(wèn)流量囊颅;
換句話(huà)說(shuō)就是提示瀏覽器該視頻不需要緩存当悔。
metadata: 提示盡管作者認(rèn)為用戶(hù)不需要查看該視頻,
不過(guò)抓取元數(shù)據(jù)(比如:長(zhǎng)度)還是很合理的踢代。
auto: 用戶(hù)需要這個(gè)視頻優(yōu)先加載盲憎;換句話(huà)說(shuō)就是提示:如果需要的話(huà),
可以下載整個(gè)視頻胳挎,即使用戶(hù)并不一定會(huì)用它饼疙。
空字符串:也就代指 auto 值。
audio標(biāo)簽的屬性
src
controls
autoplay
loop
muted
preload
音視頻js相關(guān)屬性
duration : 媒體總時(shí)間(只讀)
currentTime : 開(kāi)始播放到現(xiàn)在所用的時(shí)間(可讀寫(xiě))
muted : 是否靜音(可讀寫(xiě),相比于volume優(yōu)先級(jí)要高)
volume : 0.0-1.0的音量相對(duì)值(可讀寫(xiě))
paused : 媒體是否暫停(只讀)
ended : 媒體是否播放完畢(只讀)
error : 媒體發(fā)生錯(cuò)誤的時(shí)候慕爬,返回錯(cuò)誤代碼 (只讀)
currentSrc : 以字符串的形式返回媒體地址(只讀)
視頻多的部分:
poster : 視頻播放前的預(yù)覽圖片(讀寫(xiě))
width窑眯、height : 設(shè)置視頻的尺寸(讀寫(xiě))
videoWidth、 videoHeight : 視頻的實(shí)際尺寸(只讀)
音視頻js相關(guān)函數(shù)
play() : 媒體播放
pause() : 媒體暫停
load() : 重新加載媒體
js相關(guān)事件
視頻:
abort 在播放被終止時(shí)觸發(fā),例如, 當(dāng)播放中的視頻重新開(kāi)始播放時(shí)會(huì)觸發(fā)這個(gè)事件医窿。
canplay 在媒體數(shù)據(jù)已經(jīng)有足夠的數(shù)據(jù)(至少播放數(shù)幀)可供播放時(shí)觸發(fā)磅甩。這個(gè)事件對(duì)應(yīng)CAN_PLAY的readyState。
canplaythrough 在媒體的readyState變?yōu)镃AN_PLAY_THROUGH時(shí)觸發(fā)姥卢,表明媒體可以在保持當(dāng)前的下載速度的情況下不被中斷地播放完畢卷要。注意:手動(dòng)設(shè)置currentTime會(huì)使得firefox觸發(fā)一次canplaythrough事件,其他瀏覽器或許不會(huì)如此独榴。
durationchange 元信息已載入或已改變僧叉,表明媒體的長(zhǎng)度發(fā)生了改變。例如括眠,在媒體已被加載足夠的長(zhǎng)度從而得知總長(zhǎng)度時(shí)會(huì)觸發(fā)這個(gè)事件彪标。
emptied 媒體被清空(初始化)時(shí)觸發(fā)。
ended 播放結(jié)束時(shí)觸發(fā)掷豺。
error 在發(fā)生錯(cuò)誤時(shí)觸發(fā)捞烟。元素的error屬性會(huì)包含更多信息。參閱Error handling獲得詳細(xì)信息当船。
loadeddata 媒體的第一幀已經(jīng)加載完畢题画。
loadedmetadata 媒體的元數(shù)據(jù)已經(jīng)加載完畢,現(xiàn)在所有的屬性包含了它們應(yīng)有的有效信息德频。
loadstart 在媒體開(kāi)始加載時(shí)觸發(fā)苍息。
mozaudioavailable 當(dāng)音頻數(shù)據(jù)緩存并交給音頻層處理時(shí)
pause 播放暫停時(shí)觸發(fā)。
play 在媒體回放被暫停后再次開(kāi)始時(shí)觸發(fā)。即竞思,在一次暫停事件后恢復(fù)媒體回放表谊。
playing 在媒體開(kāi)始播放時(shí)觸發(fā)(不論是初次播放、在暫停后恢復(fù)盖喷、或是在結(jié)束后重新開(kāi)始)爆办。
progress 告知媒體相關(guān)部分的下載進(jìn)度時(shí)周期性地觸發(fā)。有關(guān)媒體當(dāng)前已下載總計(jì)的信息可以在元素的buffered屬性中獲取到课梳。
ratechange 在回放速率變化時(shí)觸發(fā)距辆。
seeked 在跳躍操作完成時(shí)觸發(fā)。
seeking 在跳躍操作開(kāi)始時(shí)觸發(fā)暮刃。
stalled 在嘗試獲取媒體數(shù)據(jù)跨算,但數(shù)據(jù)不可用時(shí)觸發(fā)。
suspend 在媒體資源加載終止時(shí)觸發(fā)椭懊,這可能是因?yàn)橄螺d已完成或因?yàn)槠渌驎和诸蚕!? timeupdate 元素的currentTime屬性表示的時(shí)間已經(jīng)改變。
volumechange 在音頻音量改變時(shí)觸發(fā)(既可以是volume屬性改變灾搏,也可以是muted屬性改變).挫望。
waiting 在一個(gè)待執(zhí)行的操作(如回放)因等待另一個(gè)操作(如跳躍或下載)被延遲時(shí)觸發(fā)
音頻:
abort 在播放被終止時(shí)觸發(fā),例如, 當(dāng)播放中的視頻重新開(kāi)始播放時(shí)會(huì)觸發(fā)這個(gè)事件。
canplay 在媒體數(shù)據(jù)已經(jīng)有足夠的數(shù)據(jù)(至少播放數(shù)幀)可供播放時(shí)觸發(fā)狂窑。這個(gè)事件對(duì)應(yīng)CAN_PLAY的readyState。
canplaythrough 在媒體的readyState變?yōu)镃AN_PLAY_THROUGH時(shí)觸發(fā)桑腮,表明媒體可以在保持當(dāng)前的下載速度的情況下不被中斷地播放完畢泉哈。注意:手動(dòng)設(shè)置currentTime會(huì)使得firefox觸發(fā)一次canplaythrough事件,其他瀏覽器或許不會(huì)如此破讨。
durationchange 元信息已載入或已改變丛晦,表明媒體的長(zhǎng)度發(fā)生了改變。例如提陶,在媒體已被加載足夠的長(zhǎng)度從而得知總長(zhǎng)度時(shí)會(huì)觸發(fā)這個(gè)事件烫沙。
emptied 媒體被清空(初始化)時(shí)觸發(fā)。
ended 播放結(jié)束時(shí)觸發(fā)隙笆。
error 在發(fā)生錯(cuò)誤時(shí)觸發(fā)锌蓄。元素的error屬性會(huì)包含更多信息。參閱Error handling獲得詳細(xì)信息撑柔。
loadeddata 媒體的第一幀已經(jīng)加載完畢瘸爽。
loadedmetadata 媒體的元數(shù)據(jù)已經(jīng)加載完畢,現(xiàn)在所有的屬性包含了它們應(yīng)有的有效信息铅忿。
loadstart 在媒體開(kāi)始加載時(shí)觸發(fā)剪决。
mozaudioavailable 當(dāng)音頻數(shù)據(jù)緩存并交給音頻層處理時(shí)
pause 播放暫停時(shí)觸發(fā)。
play 在媒體回放被暫停后再次開(kāi)始時(shí)觸發(fā)。即柑潦,在一次暫停事件后恢復(fù)媒體回放享言。
playing 在媒體開(kāi)始播放時(shí)觸發(fā)(不論是初次播放、在暫停后恢復(fù)渗鬼、或是在結(jié)束后重新開(kāi)始)览露。
progress 告知媒體相關(guān)部分的下載進(jìn)度時(shí)周期性地觸發(fā)。有關(guān)媒體當(dāng)前已下載總計(jì)的信息可以在元素的buffered屬性中獲取到乍钻。
ratechange 在回放速率變化時(shí)觸發(fā)肛循。
seeked 在跳躍操作完成時(shí)觸發(fā)。
seeking 在跳躍操作開(kāi)始時(shí)觸發(fā)银择。
stalled 在嘗試獲取媒體數(shù)據(jù)多糠,但數(shù)據(jù)不可用時(shí)觸發(fā)。
suspend 在媒體資源加載終止時(shí)觸發(fā)浩考,這可能是因?yàn)橄螺d已完成或因?yàn)槠渌驎和夹孔!? timeupdate 元素的currentTime屬性表示的時(shí)間已經(jīng)改變。
volumechange 在音頻音量改變時(shí)觸發(fā)(既可以是volume屬性改變析孽,也可以是muted屬性改變).搭伤。
waiting 在一個(gè)待執(zhí)行的操作(如回放)因等待另一個(gè)操作(如跳躍或下載)被延遲時(shí)觸發(fā)