TextTrackList

基线 广泛可用

此功能已成熟,可在许多设备和浏览器版本上正常运行。自 2015 年 7 月.

报告反馈

TextTrackList 接口用于表示与关联的视频或音频元素定义的文本轨道的列表,每个轨道在列表中都由一个单独的 textTrack 对象表示。

文本轨道可以通过使用 <track> 元素进行声明性地添加到媒体元素中,也可以通过使用 HTMLMediaElement.addTextTrack() 方法进行编程性地添加到媒体元素中。

可以通过使用 textTracks 属性从 HTMLMediaElement 对象中检索此对象的实例。

  • 对于给定的 HTMLMediaElement 对象 media,可以使用以下方法访问各个轨道:
  • media.TextTracks[n],用于从对象文本轨道列表中获取第 n 个文本轨道
EventTarget TextTrackList

实例属性

media.textTracks.getTrackById() 方法

此接口还从其父接口 EventTarget 继承属性。

length 只读

实例方法

列表中的轨道数量。

getTrackById()

此接口还从其父接口 EventTarget 继承方法。

事件

addtrack

返回在 TextTrackList 中找到的 TextTrack,其 id 与指定的字符串匹配。如果未找到匹配项,则返回 null

change

在将新的文本轨道添加到媒体元素时触发。也可以通过 onaddtrack 属性访问。

removetrack

在激活或停用文本轨道时触发。也可以通过 onchange 属性访问。

使用说明

在从媒体元素中删除新的文本轨道时触发。也可以通过 onremovetrack 属性访问。

示例

除了能够直接访问媒体元素上存在的文本轨道外,TextTrackList 还允许您在 addtrackremovetrack 事件上设置事件处理程序,以便您可以在轨道添加到或从媒体元素流中删除时进行检测。

获取视频元素的文本轨道列表

要获取媒体元素的 TextTrackList,请使用其 textTracks 属性。
const textTracks = document.querySelector("video").textTracks;

js

监控轨道计数更改

要获取媒体元素的 TextTrackList,请使用其 textTracks 属性。
textTracks.onaddtrack = updateTrackCount;
textTracks.onremovetrack = updateTrackCount;

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

规范

在此示例中,我们有一个应用程序,它显示有关可用通道数量的信息。为了保持其最新,将设置 addtrackremovetrack 事件的处理程序。
规范
# HTML 标准

浏览器兼容性

text-track-api