直播流地址
rtmp://live.hkstv.hk.lxdns.com/live/hks
API 接口
(一) Modules 模塊
1) browser ：瀏覽器
2) buffer ：緩沖
3) computed-style ：計算風格
4) dom ：文檔對象模型
5) dom-data ：文檔數據
6) evented ：事件化
7) events ：事件系統
8) extend ：擴展
9) filter-source ：過濾資源
10) fn ：函數
11) Format-time ：格式化時間
12) Guid ：唯一id
13) Log ：日志
14) merge-options ：融合選項
15) obj ：對象
16) setup ：設置
17) stateful ：有狀態
18) stylesheet ：樣式表
19) text-track-list-converter ：文本軌道李彪轉換器
20) time-ranges ：時間范圍
21) to-title-case ：首字母大寫
22) url ：網址
23) videojs ：videojs方法
(二) Classes ：類
- AudioTrack ：聲道
- AudioTrackButton ：聲道按鈕
- AudioTrackList ：聲道列表
- AudioTrackMenuItem ：聲道菜單項
- BigPlayButton ：大播放按鈕
- Button ：按鈕
- CaptionsButton ：字母按鈕
- CaptionSettingsMenuItem ：字母設置菜單項
- ChaptersButton ：章節按鈕
- ChaptersTrackMenuItem ：章節軌道菜單項
- ClickableComponent ：可點擊組件
- CloseButton ：關閉按鈕
- Component ：組件
- ControlBar ：控制條
- CurrentTimeDisplay ：當前時間展示
- CustomControlSpacer ：自定義控制間隔
- DescriptionsButton ：說明按鈕
- DurationDisplay ：持續時間顯示
- ErrorDisplay ：錯誤顯示
- EventTarget ：事件目標
- FullscreenToggle ：全屏切換
- Html5 ：html5媒體控制
- HTMLTrackElement ：html軌道元素
- HtmlTrackElementList ：html軌道元素列表
- LiveDisplay ：直播顯示
- LoadingSpinner ：加載旋轉器
- LoadProgressBar ：加載進度條
- MediaError ：媒體錯誤
- MediaLoader ：媒體加載器
- Menu ：菜單
- MenuButton ：菜單按鈕
- MenuItem ：菜單項
- ModalDialog ：模態對話框
- Log ：日志
- videojs.AudioTrack ：聲道
- videojs.EventTarget ：事件目標
- videojs.TextTrack ：文本軌道
- videojs.VideoTrack ：視頻軌道
- MouseTimeDisplay ：鼠標時間顯示
- MuteToggle ：靜音切換
- OffTextTrackMenuItem ：關閉文本軌道菜單項
- PlaybackRateMenuButton ：播放速率菜單按鈕
- PlaybackRateMenuItem ：播放速率菜單項
- Player ：播放器
- PlayProgressBar ：播放進度條
- PlayToggle ：播放切換
- Plugin ：插件
- Popup ：彈出組件
- PopupButton ：彈出按鈕
- PosterImage ：海報圖片
- ProgressControl ：進度控制組件
- RemainingTimeDisplay ：剩余時間顯示
- SeekBar ：拖動條
- Slider ：滑塊
- Spacer ：間隔元素
- SubtitlesButton ：字幕按鈕
- Tech ：控制使用的技術
- TextTrack ：文本軌道
- TextTrackButton ：文本軌道按鈕
- TextTrackCueList ：文本軌道提示列表
- TextTrackDisplay ：文本軌道顯示
- TextTrackList ：文本軌道列表
- TextTrackMenuItem ：文本軌道菜單項
- TextTrackSettings ：文本軌道設置
- TimeDivider ：時間分割器
- TimeTooltip ：時間提示
- Track ：軌道
- TrackButton ：軌道按鈕
- TrackList ：軌道列表
- VideoTrack ：視頻軌道
- VideoTrackList ：視頻軌道列表
72.VolumeBar ：音量欄
包含音量級別的欄，可以單擊以調整級別
Members
72.1 playerEvent :string
當播放器發生此事件時，調用此滑塊的更新事件。
Methods
72.2 calculateDistance(event) → {number}
計算滑塊距離
72.3 checkMuted()
如果播放器靜音就取消靜音
72.4 createEl() → {Element}
創建組件的dom元素
72.5 getPercent() → {number}
獲取音量的百分比
72.6 handleBlur(event)
處理此滑塊上的觸發事件
72.7 handleClick(event)
滑塊上的點擊事件的偵聽器，用於防止點擊冒泡到像按鈕菜單這樣的父元素。
72.8 handleFocus(event)
處理此滑塊上的焦點事件
72.9 handleKeyPress(event)
處理此滑塊上的按鍵事件，監視上、下、左、右箭頭按鍵，此函數僅在滑塊具有焦點是被調用
72.10 handleMouseDown(event)
處理滑塊上的mousedown或touchstart事件
72.11 handleMouseMove(event)
處理VolumeMenuButton上的鼠標移動事件
72.12 handleMouseUp(event)
72.13 處理滑塊上的mouseup或touchend事件。
72.14 stepBack()
降低鍵盤用戶的音量
72.15 stepForward()
提高鍵盤用戶的音量
72.16 update() → {number}
更新滑塊的進度條。
72.17 updateARIAAttributes(eventopt)
更新ARIA輔助功能屬性
72.18 vertical(boolopt) → {boolean}
獲取或設置滑塊為水平或者垂直
Events
72.19 slideractive
當滑塊處於活動狀態時觸發
72.20 Sliderinactive
當滑塊不再處於活動狀態時觸發。
73.VolumeControl ：音量控制組件
74.VolumeLevel ：音量層級
75.VolumePanel ：音量面板
(三) Mixins ：混合器
1) EventedMixin ：事件混合器
2) StatefulMixin ：狀態混合器
Guides 向導
1) audio-tracks ：音軌
音頻軌道是HTML5視頻的特征，用於向用戶提供替代音軌選擇，使得可以播放除主軌道之外的軌道。 Video.js提供了跨瀏覽器的音軌實現。
1.1 注意
2) Components ：組件
Video.js播放器的架構圍繞組件。 Player類和表示播放器控件和其他UI元素的所有類繼承自Component類。 這種架構使得可以輕松地以反映DOM的樹狀結構構建Video.js播放器的用戶界面。
2.1 什么是組件？
組件是具有以下功能的JavaScript對象：
- 相關聯的DOM元素。
- 與Player對象的關聯。
- 能夠管理任意數量的子組件。
- 監聽和觸發事件的能力。
- 初始化和處置的生命周期。
有關組件的編程接口的更多詳細信息，請參閱組件API文檔。
2.2 創建組件
Video.js組件可以繼承並注冊到Video.js以向播放器添加新功能和UI。
對於一個工作示例，我們有一個JSBin演示創建一個組件，用於在播放器頂部顯示標題。
此外，有幾種方法值得認可：
l videojs.getComponent（String name）：從Video.js檢索組件構造函數。
l videojs.registerComponent（String name，Function Comp）：使用Video.js注冊組件構造函數。
l videojs.extend（Function component，Object properties）：提供原型繼承。 可用於擴展組件的構造函數，返回具有給定屬性的新構造函數
2.3 子組件
同樣，請參閱組件API文檔，以獲取有關管理組件結構的方法的完整詳細
2.3.1 基本示例
當子組件添加到父組件時，Video.js將子組件插入到父組件的元素中
相反，刪除子組件將從DOM中刪除子組件的元素：
2.3.2 使用選項
傳遞兒童構造器的選項和子代的子選項。
當組件初始化時，也可以通過選項添加子項。
注意：包括一個'name'鍵，如果兩個相同類型的子組件需要不同的選項，將使用它。
2.4 事件監聽
2.4.1 使用on
myFunc的上下文將是myComponent，除非它被綁定。 您可以將偵聽器添加到另一個元素或組件。
2.4.2 使用off
如果myFunc被排除，事件類型的所有偵聽器將被刪除。 如果eventType被排除，所有偵聽器將從組件中刪除。 您可以使用off來刪除添加到其他元素或組件的偵聽器：
myComponent.on（otherComponent ...
在這種情況下，事件類型和偵聽器函數都是REQUIRED。
2.4.3 使用one
您還可以將偵聽器添加到將只觸發一次的另一個元素或組件。
2.4.4 使用trigger
2.5 默認組件
Video.js播放器的默認組件結構如下所示
2.6 特定組件詳細信息
2.6.1 Volume Panel 音量面板
VolumePanel包括MuteToggle和VolumeControl組件，如果不支持聲音更改，它將被隱藏。 VolumePanel有一個重要的選項，它可以使您的VolumeControl在MuteToggle上垂直顯示。 這可以通過傳遞VolumePanel {inline：false}來設置，因為默認行為是設置為{inline：true}的水平VolumeControl
2.6.2 文本軌道設置
文本軌道設置組件僅在使用模擬文本軌道時可用。
3) Debugging ：調試
Video.js包含一個輕量級封裝器 - videojs.log - 圍繞控制台API的一個子集。 可用的方法是videojs.log，videojs.log.warn和videojs.log.error。
3.1 API Overview ：API概述
大多數這些方法應該是相當一目了然的，但有關完整的詳細信息，請參閱API文檔。
有關這些功能的說明，請參閱以下部分。
3.2 Log Safely ：安全記錄
與控制台不同，可以在代碼中保留videojs.log調用。 當控制台不存在時，它們不會拋出錯誤。
3.3 Log Objects Usefully ：日志對象有效
與控制台類似，任何數量的混合類型值都可以傳遞給videojs.log方法：
但是，某些瀏覽器控制台（即IE10和更低版本）不支持非字符串值。 Video.js通過在IE10及更低版本中記錄對象之前傳遞對象通過JSON.stringify改善了這種情況。 換句話說，代替上述產生：
3.4 Log Levels ：日志級別
與控制台不同，videojs.log包括日志級別的概念。 這些級別打開或關閉日志記錄方法。
通過videojs.log.level方法公開級別。 此方法同時作為當前日志記錄級別的getter和setter。 沒有參數，它返回當前日志記錄級別：
通過傳遞字符串，日志記錄級別可以更改為可用的日志記錄級別之一：
3.5 Available Log Levels ：可用日志級別
3.5.1 all（默認）：啟用所有日志記錄方法
3.5.2 error：僅顯示log.error消息
3.5.3 off：禁用所有日志記錄方法
3.5.4 warn：僅顯示log.warn和log.error消息
3.6 History ：歷史
注意：在Video.js 5中，videojs.log.history是一個數組。 從Video.js 6開始，它是一個返回數組的函數。 進行此更改是為了提供更豐富，更安全的日志記錄API。
默認情況下，videojs.log模塊跟蹤傳遞給它的所有內容的歷史記錄，而不考慮日志記錄級別：
即使日志記錄設置為關閉，這也將工作。
這可能是有用的，但它也可能是內存泄漏的來源。 例如，記錄的對象將被保留在歷史中，即使引用在其他地方被刪除！
為了避免這個問題，可以通過方法調用來禁用或啟用歷史記錄（分別使用disable和enable方法）。 停用歷史記錄非常簡單：
最后，歷史記錄（如果啟用）可以隨時通過以下方式清除：
4) event-target ：事件目標
設置video.js中的事件，以便它們模仿對象上使用的DOM API，但也具有相同功能的有用的速記功能
5) Faq ：問答
6) Hooks ：鈎子
6.1 存在掛鈎，以便用戶可以“掛鈎”某些video.js播放器生命周期
7) Languages ：語言
7.1 多語言支持允許非英語區域設置的用戶與Video.js播放器進行本地交互。
8) modal-dialog ：模態對話框
8.1 ModalDialog組件是Video.js核心的一部分，為完整播放器覆蓋提供了一個定制的UI。
9) Options ：選項
9.1 注意：本文檔僅作為可用選項的參考。 要了解將選項傳遞給Video.js，請參閱設置指南。
10) player-workflows ：播放器工作流
10.1 本文檔概述了使用Video.js進行高級播放器工作流程時的許多注意事項。 請務必先閱讀設置指南！
11) Plugins ：插件
11.1 Video.js的一個強大的優勢是它的插件生態系統，允許來自世界各地的作者分享他們的視頻播放器自定義。 這包括從最簡單的UI調整到新的播放技術和源處理程序的一切！
12) React ：reactJs上的應用
13) Setup ：設置
14) Skins ：皮膚
15) Tech ：播放技術
16) text-tracks ：文本軌道
17) tracks ：軌道
18) troubleshooting ：故障排除
19) video-tracks ：視頻軌道
20) videojs ：