紀(jì)翠竹

摘要：本文利用HTML5的

關(guān)鍵詞：HTML5；富媒體；視頻；播放器；JavaScript

中圖分類號(hào)：TP393 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1007-9416（2017）04-0195-01

大數(shù)據(jù)時(shí)代，富媒體元素早已突破了傳輸?shù)钠款i，成為互聯(lián)網(wǎng)的重要組成部分。本文從提升用戶體驗(yàn)出發(fā)，兼顧各瀏覽器對(duì)視頻文件的支持情況，介紹基于HTML5的自定義控制欄的視頻播放器技術(shù)的應(yīng)用。

1

2 HTML DOM Video對(duì)象

HTML5為Video對(duì)象提供了用于DOM操作的方法、屬性和事件，下面，我們用一個(gè)簡(jiǎn)單的例子說(shuō)明一下如何使用JavaScript代碼操作Video對(duì)象。如圖1所示，定義了一個(gè)用于控制播放或暫停的按鈕，然后為該按鈕的onclick事件定義方法playPause（），使用JavaScript的條件語(yǔ)句進(jìn)行狀態(tài)的判斷，當(dāng)該播放器的狀態(tài)為暫停時(shí)調(diào)用play（）方法，切換為播放，這個(gè)按鈕是個(gè)反復(fù)鍵，在播放或暫停狀態(tài)下進(jìn)行切換。

3 網(wǎng)頁(yè)的部分

該頁(yè)面由一個(gè)