TextTrackList
基线 广泛可用
此功能已成熟,可在许多设备和浏览器版本上正常运行。自 2015 年 7 月.
报告反馈
TextTrackList
接口用于表示与关联的视频或音频元素定义的文本轨道的列表,每个轨道在列表中都由一个单独的 textTrack
对象表示。
文本轨道可以通过使用 <track>
元素进行声明性地添加到媒体元素中,也可以通过使用 HTMLMediaElement.addTextTrack()
方法进行编程性地添加到媒体元素中。
可以通过使用 textTracks
属性从 HTMLMediaElement
对象中检索此对象的实例。
- 对于给定的
HTMLMediaElement
对象 media,可以使用以下方法访问各个轨道: media.TextTracks[n]
,用于从对象文本轨道列表中获取第 n 个文本轨道
实例属性
media.textTracks.getTrackById()
方法
- 此接口还从其父接口
EventTarget
继承属性。 -
length
只读
实例方法
列表中的轨道数量。
getTrackById()
-
此接口还从其父接口
EventTarget
继承方法。
事件
addtrack
-
返回在
TextTrackList
中找到的TextTrack
,其id
与指定的字符串匹配。如果未找到匹配项,则返回null
。 change
-
在将新的文本轨道添加到媒体元素时触发。也可以通过
onaddtrack
属性访问。 removetrack
-
在激活或停用文本轨道时触发。也可以通过
onchange
属性访问。
使用说明
在从媒体元素中删除新的文本轨道时触发。也可以通过 onremovetrack
属性访问。
示例
除了能够直接访问媒体元素上存在的文本轨道外,TextTrackList
还允许您在 addtrack
和 removetrack
事件上设置事件处理程序,以便您可以在轨道添加到或从媒体元素流中删除时进行检测。
获取视频元素的文本轨道列表
要获取媒体元素的
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);
}
规范
在此示例中,我们有一个应用程序,它显示有关可用通道数量的信息。为了保持其最新,将设置 addtrack 和 removetrack 事件的处理程序。 |
---|
规范 # HTML 标准 |
浏览器兼容性
text-track-api