VideoTrackList

例項屬性

此介面還繼承了其父介面 EventTarget 的屬性。

length 只讀

列表中軌道的數量。

selectedIndex 只讀

當前選中軌道的索引（如果存在），否則為 −1。

例項方法

此介面還繼承了其父介面 EventTarget 的方法。

getTrackById()

返回 VideoTrackList 中 id 與指定字串匹配的 VideoTrack。如果未找到匹配項，則返回 null。

事件

addtrack

當有新的影片軌道新增到媒體元素時觸發。也可透過 onaddtrack 屬性訪問。

change

當影片軌道變為活動或非活動狀態時觸發。也可透過 onchange 屬性訪問。

removetrack

當有影片軌道從媒體元素中移除時觸發。也可透過 onremovetrack 屬性訪問。

用法說明

除了能夠直接訪問媒體元素上存在的影片軌道外，VideoTrackList 還允許您為 addtrack 和 removetrack 事件設定事件處理器，以便您可以檢測到軌道何時被新增到媒體元素的流中或從其流中移除。

示例

獲取媒體元素的影片軌道列表

要獲取媒體元素的 VideoTrackList，請使用其 videoTracks 屬性。

const videoTracks = document.querySelector("video").videoTracks;

監控軌道數量的變化

在此示例中，我們有一個顯示可用頻道數量的應用。為了保持其最新狀態，設定了 addtrack 和 removetrack 事件的處理器。

videoTracks.onaddtrack = updateTrackCount;
videoTracks.onremovetrack = updateTrackCount;

function updateTrackCount(event) {
  trackCount = videoTracks.length;
  drawTrackCountIndicator(trackCount);
}

規範

瀏覽器相容性