HTMLMediaElement:textTracks 属性
textTracks
属性是在 HTMLMediaElement
对象上的只读属性,它返回一个 TextTrackList
对象,该对象列出了表示媒体元素文本轨道的 TextTrack
对象,顺序与文本轨道列表中的顺序相同。
可以使用 addtrack
和 removetrack
事件检测何时向 <audio>
或 <video>
元素添加和删除轨道。但是,这些事件不会直接发送到媒体元素本身。相反,它们会发送到与添加到元素的轨道类型相对应的 HTMLMediaElement
的轨道列表对象。
返回的列表是动态的;也就是说,随着轨道被添加到媒体元素中或从其中删除,列表的内容会动态更改。获得对列表的引用后,可以监视它以检测更改,以便在添加新的文本轨道或删除现有的文本轨道时进行检测。
参见 TextTrackList 事件,以了解有关监视媒体元素轨道列表更改的更多信息。
值
一个 TextTrackList
对象,表示包含在媒体元素中的文本轨道列表。可以使用 textTracks[n]
访问轨道列表,以获取对象轨道列表中的第 n 个文本轨道,或者使用 textTracks.getTrackById()
方法。
每个轨道都由一个 TextTrack
对象表示,该对象提供有关轨道的相关信息。
示例
我们从一个包含多个 <track>
子节点的 <video>
元素开始
html
<video controls poster="/images/sample.gif">
<source src="sample.mp4" type="video/mp4" />
<source src="sample.ogv" type="video/ogv" />
<track kind="captions" src="sampleCaptions.vtt" srclang="en" />
<track kind="descriptions" src="sampleDescriptions.vtt" srclang="en" />
<track kind="chapters" src="sampleChapters.vtt" srclang="en" />
<track kind="subtitles" src="sampleSubtitles_de.vtt" srclang="de" />
<track kind="subtitles" src="sampleSubtitles_en.vtt" srclang="en" />
<track kind="subtitles" src="sampleSubtitles_ja.vtt" srclang="ja" />
<track kind="subtitles" src="sampleSubtitles_oz.vtt" srclang="oz" />
<track kind="metadata" src="keyStage1.vtt" srclang="en" label="Key Stage 1" />
<track kind="metadata" src="keyStage2.vtt" srclang="en" label="Key Stage 2" />
<track kind="metadata" src="keyStage3.vtt" srclang="en" label="Key Stage 3" />
</video>
HTMLMediaElement.textTracks
返回一个 textTracksList
,我们可以通过它进行迭代。这里我们将每个英文轨道的属性都打印到控制台。
js
const tracks = document.querySelector("video").textTracks;
for (const track of tracks) {
if (track.language === "en") {
console.dir(track);
}
}
规范
规范 |
---|
HTML 标准 # dom-media-texttracks-dev |
浏览器兼容性
BCD 表格仅在浏览器中加载
另请参见
HTMLMediaElement
:用于定义HTMLMediaElement.textTracks
属性的接口<audio>
,<video>
AudioTrack
,AudioTrackList
VideoTrack
,VideoTrackList
-
addtrack
,change
,removetrack
:AudioTrackList 事件 -
addtrack
,change
,removetrack
:VideoTrackList 事件