的其他常規(guī)屬性（如style、class等），甚至在該接口不可見(jiàn)時(shí)也是如此。
表2 < Video >元素屬性
|
屬性名稱 |
值的格式 |
描述 |
|
src |
xs:anyURI |
該屬性提供媒體源的URL地址 |
|
autobuffer |
Autobuffer（自動(dòng)緩沖） |
在網(wǎng)頁(yè)顯示時(shí)，該二進(jìn)制屬性表示是由用戶代理（瀏覽器）自動(dòng)緩沖的內(nèi)容，還是由用戶使用相關(guān)API進(jìn)行內(nèi)容緩沖 |
|
autoplay |
Autoplay（自動(dòng)播放） |
在網(wǎng)頁(yè)顯示時(shí)，該二進(jìn)制屬性表示當(dāng)網(wǎng)頁(yè)完成載入后瀏覽器是否應(yīng)該自動(dòng)播放視頻 |
|
loop |
Loop（循環(huán)） |
在網(wǎng)頁(yè)顯示時(shí)，該二進(jìn)制屬性表示當(dāng)多媒體運(yùn)行結(jié)束后瀏覽器是否應(yīng)該自動(dòng)循環(huán)播放 |
|
controls |
Controls（控制） |
在網(wǎng)頁(yè)顯示時(shí)，該二進(jìn)制屬性表示用戶代理（瀏覽器）是否允許用戶對(duì)視頻進(jìn)行控制 |
|
width |
dimension ###(cm|em|en|in|px|pt|%) |
該屬性表示在合適的地方提供視頻圖像的顯示寬度。當(dāng)高度未指明時(shí)，其值將與給定的初始視頻寬度成一定比例 |
|
height |
dimension ###(cm|em|en|in|px|pt|%) |
該屬性表示在合適的地方提供視頻圖像的顯示高度。當(dāng)寬度未指明時(shí)，其值將與給定的初始視頻高度成一定比例 |
|
poster |
xs:anyURI |
當(dāng)視頻未響應(yīng)或緩沖不足時(shí)，該屬性值鏈接到一個(gè)圖像。該圖像將以一定比例被顯示出來(lái) |
當(dāng)視頻處于緩沖狀態(tài)時(shí)，Poster實(shí)際上是一個(gè)圖像占位符，它并不總是必需的。當(dāng)預(yù)載入視頻時(shí)，許多視頻編解碼器會(huì)自動(dòng)從視頻中解壓一個(gè)特殊的圖片來(lái)作為poster。當(dāng)然，并不是所有的編解碼器（codec）都有這一功能。
當(dāng)視頻載入時(shí)，在特定環(huán)境下使用指定poster（放棄視頻所提供的默認(rèn)poster）來(lái)做為某個(gè)視頻的“商標(biāo)”是非常有幫助的。當(dāng)視頻開(kāi)始播放或是暫停時(shí)，poster所顯示的圖片與內(nèi)容是不相干的。在另一種情況中，解碼器可以顯示視頻暫停前的最后一張圖片，或者當(dāng)視頻持續(xù)播放時(shí)，視頻的最后一幀圖片將會(huì)顯示出來(lái)。
通常情況下，視頻和音頻的播放會(huì)采用指定媒體源所壓縮到媒體中的編解碼器，但有時(shí)瀏覽器并不支持某種特殊的的編解碼器。在這種情況下，可以使用@src屬性作為解決方案，HTML5同時(shí)定義了第二個(gè)元素，它主要的作用是定義媒體源所在的位置及媒體源播放所使用的編解碼器類型。表3 列出了元素的定義
表3 元素屬性
|
屬性名稱 |
值的格式 |
描述 |
|
src |
xs:anyURI |
該屬性提供媒體源的URL地址 |
|
type |
媒體源的隱藏類型，字符串形式 |
該屬性包含了媒體源的播放隱藏類型，通常出現(xiàn)在視頻格式中 |
|
media |
一個(gè)媒體編解碼器的字符串 |
該字符串包含了與指定媒體源所匹配的編解碼器信息 |
在多元素存在的情況下，如果web瀏覽器不能使用第一個(gè)指定編解碼器（瀏覽器不支持），它將會(huì)搜尋列表直到發(fā)現(xiàn)第一個(gè)可以使用的編解碼器為止。
HTML 5代碼后面所緊跟的比特描述了視頻元素所支持的三種不同編解碼器：
第一種情況是：如果元素描述的是mp4資源（最典型的視頻類型為MPEG格式，盡管它們經(jīng)常是“mpg”格式的直接擴(kuò)展），那么它將使用baseline profile 編解碼器。第二種情況是將視頻與simple profile視頻編解碼器一起編碼，第三種情況是將視頻與Ogg-vorbis編解碼器一同編碼。最典型的做法是，讓@type屬性包含關(guān)聯(lián)的隱藏屬性。如果它沒(méi)有包含，那么@media屬性可以通過(guò)@type信息來(lái)確定。注意，你在判斷@src屬性時(shí)可以有多種選擇：即使元素存在，它也會(huì)被提前使用，但你必須在你的媒體元素中選擇一個(gè)。（編輯注：HTML 5標(biāo)準(zhǔn)確立的最大的爭(zhēng)議點(diǎn)就是有關(guān)視頻元素所支持的編解碼器的問(wèn)題。比如Mozilla堅(jiān)持將開(kāi)放的Ogg標(biāo)準(zhǔn)加入進(jìn)來(lái)，而蘋(píng)果則爭(zhēng)搶著把MP4標(biāo)準(zhǔn)加入，其他公司也抱著相同的想法。這就造成了上述描寫(xiě)的情況。）
理論上，
與更為人熟知的MPEG格式相比，Ogg Vorbis標(biāo)準(zhǔn)是開(kāi)源并且資料非常詳實(shí)。因此，在為游戲及在線應(yīng)用程序存儲(chǔ)音頻文件時(shí)，Ogg Vorbis格式非常受歡迎。與其他格式相比，Ogg Vorbis/Theora 并沒(méi)有得到HTML 5規(guī)范所給予的更多優(yōu)惠，但它是Firefox唯一支持的格式。
Chrome 和 Safari 團(tuán)隊(duì)均宣布有可能將兩種標(biāo)準(zhǔn)都添加進(jìn)來(lái)的打算。
#p#
音頻，視頻以及DOM
從IDL中可以看出，媒體元素的API主要完成以下工作：
Src屬性負(fù)責(zé)設(shè)置媒體的@src屬性，但src屬性的改變并不能自動(dòng)改變當(dāng)前視頻的屬性。當(dāng)你改變src后，你需要調(diào)用load()函數(shù)來(lái)對(duì)新視頻及其屬性進(jìn)行重新載入，并在視頻完成載入和緩沖后調(diào)用play()。在一個(gè)純粹的并行網(wǎng)絡(luò)世界中，完成這個(gè)工作相對(duì)容易。當(dāng)你從一個(gè)正在運(yùn)行的web頁(yè)面上下載媒體到本地文件時(shí)，這些代碼已經(jīng)開(kāi)始運(yùn)行了。
然而，媒體文件在本質(zhì)上是一個(gè)需要較長(zhǎng)時(shí)間的過(guò)程。當(dāng)你需要同時(shí)完成載入、緩沖音頻及視頻文件及網(wǎng)絡(luò)連接時(shí)，這將是一個(gè)巨大的挑戰(zhàn)，因?yàn)檫@會(huì)受到很多因素的影響。由于這個(gè)原因，當(dāng)我們?cè)谔幚韜eb上的音頻及視頻時(shí)，如果你想對(duì)該過(guò)程進(jìn)行控制的話，那你就不得不采取異步工作的方式，將客戶端在媒體服務(wù)器中獲得的各種信息進(jìn)行重新處理。表4（直接提取于HTML5文檔）提供了一個(gè)各種事件以及在它們被調(diào)度時(shí)的完整信息。
表4：媒體用戶接口事件
|
事件名稱 |
接口 |
在什么時(shí)將被調(diào)度 |
前提條件 |
|
Loadstart 加載開(kāi)始 |
Event 事件 |
瀏覽器開(kāi)始尋找媒體數(shù)據(jù)，作為資源選擇算法的一部分 |
NETWORK_LOADING 網(wǎng)絡(luò)狀態(tài)為裝載狀態(tài) |
|
Progress 進(jìn)度 |
Event 事件 |
瀏覽器獲取媒體數(shù)據(jù)。 |
NETWORK_LOADING 網(wǎng)絡(luò)狀態(tài)為裝載狀態(tài) |
|
Suspend 掛起 |
Event 事件 |
瀏覽器有意不在當(dāng)前獲取媒體數(shù)據(jù)，但是也不全部下載媒體資源 |
NETWORK_IDLE 網(wǎng)絡(luò)狀態(tài)為空閑狀態(tài) |
|
Abort 終止 |
Event 事件 |
在媒體數(shù)據(jù)完全下載完之前，瀏覽器停止獲得媒體數(shù)據(jù)。這不能歸因于一個(gè)錯(cuò)誤的發(fā)生 |
錯(cuò)誤是一個(gè)對(duì)象，表示媒體錯(cuò)誤終止的MEDIA_ERR_ABORTED代碼。此時(shí)，網(wǎng)絡(luò)是處于空載狀態(tài)，還是處于空閑狀態(tài)，取決于什么時(shí)候下載終止 |
|
Error 錯(cuò)誤 |
Event 事件 |
當(dāng)取得數(shù)據(jù)時(shí)，錯(cuò)誤發(fā)生。 |
錯(cuò)誤是一個(gè)對(duì)象，表示媒體錯(cuò)誤終止的MEDIA_ERR_NETWORK代碼或更高層次的代碼。此時(shí)，網(wǎng)絡(luò)是處于空載狀態(tài)，還是處于空閑狀態(tài)，取決于什么時(shí)候下載終止 |
|
Emptied 空閑 |
Event 事件 |
先前網(wǎng)絡(luò)狀態(tài)不是處于空載狀態(tài)的媒體要素剛剛轉(zhuǎn)向了這種狀態(tài)（或者是因?yàn)楫?dāng)下載時(shí)被報(bào)告了一個(gè)致命的錯(cuò)誤，或者是因?yàn)楫?dāng)資源選擇算法已經(jīng)運(yùn)行時(shí)，load()方法被調(diào)用，這種情況下它是與load()方法的調(diào)用同時(shí)發(fā)生的） |
網(wǎng)絡(luò)狀態(tài)為空載狀態(tài)，所有的IDL屬性都是初始化狀態(tài) |
|
Stalled 遲延 |
Event 事件 |
瀏覽器正在獲取數(shù)據(jù)，但是數(shù)據(jù)出乎意料的沒(méi)有到來(lái) |
NETWORK_LOADING. 網(wǎng)絡(luò)狀態(tài)為裝載狀態(tài) |
|
Play 播放 |
Event 事件 |
重新播放已經(jīng)開(kāi)始。當(dāng)play()方法返回后，接著播放 |
暫停是最近的為假 |
|
Pause 暫停 |
Event 事件 |
重新播放已經(jīng)被停止。當(dāng)pause方法返回后，接著播放 |
暫停是最近的為真 |
|
Loadedmetadata 裝載媒體數(shù)據(jù) |
Event 事件 |
瀏覽器決定媒體資源的持續(xù)時(shí)間和尺度。 |
準(zhǔn)備狀態(tài)最近處于擁有當(dāng)前的數(shù)據(jù)或第一次大于所需的數(shù)據(jù)的狀態(tài) |
|
Loadeddata 裝載數(shù)據(jù) |
Event 事件 |
瀏覽器能夠歸還數(shù)據(jù)當(dāng)?shù)谝淮翁幱诋?dāng)前重播的位置 |
準(zhǔn)備狀態(tài)最近提升到擁有的數(shù)據(jù)或第一次大于所需的數(shù)據(jù)的狀態(tài) |
|
Waiting 等待 |
Event 事件 |
因?yàn)橄乱粋€(gè)幀不能得到，所以重新播放被停止，但是瀏覽器希望這個(gè)架構(gòu)在這個(gè)過(guò)程中能被得到 |
準(zhǔn)備狀態(tài)最近等于或少于當(dāng)前的數(shù)據(jù)，暫停則為假。要么搜索為真，要么當(dāng)前回放位置不包含在緩沖的數(shù)據(jù)中。 |
|
Playing 正在播放 |
Event 事件 |
回放被啟動(dòng) |
準(zhǔn)備狀態(tài)最近等于或多于未來(lái)的數(shù)據(jù)，暫停則為假，搜索則為假；要么當(dāng)前回放位置包含在緩沖的數(shù)據(jù)中。 |
|
Canplay 能夠播放 |
Event 事件 |
瀏覽器能夠繼續(xù)回放媒體數(shù)據(jù)，但如果回放操作現(xiàn)在就開(kāi)始的話，不用停下來(lái)等待進(jìn)一步的緩沖，媒體資源則不能以當(dāng)前的回放速率一直工作到結(jié)束 |
準(zhǔn)備狀態(tài)最近增加到未來(lái)的數(shù)據(jù)或更多 |
|
Canplaythrough 能夠從頭到尾的播放 |
Event 事件 |
瀏覽器如果現(xiàn)在就開(kāi)始回放操作的話，媒體資源能以當(dāng)前的回放速率一直工作，而不用停下來(lái)等待進(jìn)一步的緩沖 |
準(zhǔn)備狀態(tài)最近等于足夠的數(shù)據(jù) |
|
Seeking 正在尋找 |
Event 事件 |
尋找IDL的屬性被修改為真，搜索操作用去的時(shí)間很長(zhǎng)。 |
|
|
Seeked 尋找 |
Event 事件 |
尋找IDL的屬性被修改為假 |
|
|
Timeupdate 時(shí)間更新 |
Event 事件 |
作為正?；胤诺囊徊糠?，當(dāng)前回放位置被改變；或是以一種有趣的方式進(jìn)行回放，如間斷進(jìn)行 |
|
|
Ended 結(jié)束 |
Event 事件 |
因?yàn)榈竭_(dá)了媒體資源的終點(diǎn)，所以回放被停止 |
當(dāng)前的時(shí)間等同于媒體資源結(jié)束的時(shí)間；結(jié)束為真。 |
|
Ratechange 交換率 |
Event 事件 |
defaultPlaybackRate或是playbackRate屬性已被更新。 |
|
|
Durationchange 持續(xù)期的交換 |
Event 事件 |
duration屬性已被更新 |
|
|
Volumechange 卷交換 |
Event 事件 |
volume屬性或是muted屬性被修改。在相關(guān)屬性的安裝已經(jīng)返回后，開(kāi)始工作 |
|
在表4的所有事件中，事件canplay 和 canplaythrough是最有用的。首先，當(dāng)足夠的數(shù)據(jù)被視頻播放器載入并開(kāi)始播放時(shí)，canplay將會(huì)被使用（即便所有數(shù)據(jù)并未完全載入）。對(duì)于事件canplaythrough來(lái)說(shuō),它會(huì)在數(shù)據(jù)完全載入到瀏覽器緩沖區(qū)之后才會(huì)運(yùn)行，這樣使得視頻可以流暢播放，無(wú)需因等待缺失數(shù)據(jù)而暫停。
當(dāng)視頻文件已經(jīng)有足夠的數(shù)據(jù)可以開(kāi)始播放時(shí)，它將產(chǎn)生oncanplay事件，該事件可以點(diǎn)亮Play按鈕。也就是說(shuō)，當(dāng)用戶按下Play按鈕時(shí)，它實(shí)際上已經(jīng)在播放剛剛下載完成的視頻了。
#t#但這些僅僅在理論上是可行的。實(shí)際上，即使在firefox中，
瀏覽器供應(yīng)商的情有獨(dú)鐘
一切跡象表明，瀏覽器供應(yīng)商們把HTML 5標(biāo)準(zhǔn)中對(duì)多媒體方面的支持看成是重中之重（編輯推薦閱讀：HTML 5與瀏覽器們不得不說(shuō)的故事）。由于HTML 5可以支持多種媒體格式，并能夠更加有效在WEB瀏覽器中播放音頻和視頻，出現(xiàn)這種情況是自然而然的。然而，在HTML 5對(duì)多媒體的支持普及之前，瀏覽器對(duì)這些技術(shù)標(biāo)準(zhǔn)的實(shí)現(xiàn)還有很長(zhǎng)的路要走。
【譯稿，非經(jīng)授權(quán)請(qǐng)勿轉(zhuǎn)載。合作站點(diǎn)轉(zhuǎn)載請(qǐng)注明原文譯者和出處為，且不得修改原文內(nèi)容?！?/p>
原文：Exploring HTML 5's Audio/Video Multimedia Support 作者：Kurt Cagle
當(dāng)前文章：Web視聽(tīng)時(shí)代來(lái)臨HTML5視頻音頻元素全解析
URL地址：
http://m.5511xx.com/article/dhhjegs.html
建站
咨詢
售后
建站咨詢
