HTML <track> 元素用作媒体元素 <audio> 和 <video> 的子元素。它允许您指定定时文本轨道（或基于时间的数据），例如自动处理字幕。轨道的格式为WebVTT 格式（ .vtt 文件） - Web 视频文本轨道。

带有两个字幕轨道的视频：

<video width="320" height="240" controls>
  <source src="forrest_gump.mp4" type="video/mp4">
  <source src="forrest_gump.ogg" type="video/ogg">
  <track src="subtitles_en.vtt" kind="subtitles" srclang="en"
  label="English">
  <track src="subtitles_no.vtt" kind="subtitles" srclang="no"
  label="Norwegian">
</video>

特性

内容类别	无
允许的内容	无，它是一个空元素。
标签省略	因为它是一个空元素，所以必须有开始标记，并且不能有结束标签。
允许的父元素	一个媒体元素，在任何流式内容之前。
允许的 ARIA 角色	无
DOM 接口	HTMLTrackElement

属性

该元素包含了全局属性。

default

该属性表示默认使用该轨道，除非用户的偏好设置指定了另一个更合适的轨道。每个媒体元素中，只能有一个 track 元素有该属性。

kind

文本轨道是如何使用的。如果省略，默认值是 subtitles。如果该属性不存在，它将使用 subtitles。如果该属性的值无效，则它将使用 metadata。（Chrome 52 版本之前， 将无效值视为 subtitles。）允许使用以下关键字：

• subtitles
  • 字幕给观众无法理解的内容提供了翻译。例如在英语电影中不是英语的对话或文本。
  • 字幕可能包含其他内容，通常是额外的背景信息。例如 “星球大战” 电影开头的文字，或场景的日期，时间和地点。
• captions
  • 隐藏式字幕提供了音频的转录，可能还包括音频的翻译。
  • 它可能包含重要的非语言信息，如音乐提示或音效。它可能指示了提示的来源（例如音乐，文字，字符）。
  • 适用于耳聋的人或设置为静音的用户。
• descriptions
  • 视频内容的文字描述。
  • 适用于盲人或无法看到视频的用户。
• chapters
  • 章节标题旨在用户在浏览媒体资源时使用。
• metadata
  • 脚本使用的轨道。对用户不可见。

label

在列出可用文本轨道时，浏览器使用的文本轨道的用户可读标题。

src

轨道的地址（ .vtt 文件）。必须是有效的网址。该属性必须被定义。

srclang

轨道文本数据的语言。它必须是有效的 BCP 47 语言标签。如果 kind 属性设置为 subtitles，则必须定义设置 srclang。

事件属性

<track> 元素支持 HTML 的事件属性。

使用注意

track 添加到媒体的 kind 属性值，可以使用的值有 subtitles，captions，descriptions，chapters 或 metadata。该元素指向一个源文件，其中包含浏览器在用户请求附加数据时公开的定时文本。

一个 media 元素的任意两个 track 子元素不能有相同的 kind，srclang 和 label 属性。

更多实例

<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">
   <!-- Fallback -->
   ...
</video>

规范

规范	状态	备注
HTML Living Standard track element 的定义	现行的标准	-
HTML5 track element 的定义	推荐	初始定义

HTML 4.01 与 HTML5 之间的差异

<track> 元素是 HTML5 中的新元素。

桌面浏览器兼容性

移动浏览器兼容性

1. 不适用于全屏视频。

2. 从版本 24 开始到版本 50 (不包括)：该特性由 media.webvtt.enabled 首选项控制（需要设置为 true）。要更改 Firefox 中的首选项，请访问 about:config。

相关链接

• WebVTT 文本轨道格式