TextTrack：mode 属性

一个指示轨道当前模式的字符串。以下之一：

disabled

文本轨道当前已禁用。虽然轨道的存在在 DOM 中可见，但用户代理会忽略它。没有提示处于活动状态，没有事件正在触发，并且用户代理不会尝试获取轨道的提示。这是默认值，除非文本轨道具有default 布尔属性，在这种情况下，默认值为 showing。

hidden

文本轨道当前处于活动状态，但提示未显示。如果用户代理尚未尝试获取轨道的提示，它将很快这样做（从而填充轨道的TextTrack.cues 属性）。用户代理正在保留活动提示的列表（在轨道的activeCues 属性中），并且即使文本未显示，也会在相应的时间触发事件。

showing

文本轨道当前已启用且可见。如果尚未获取轨道的提示列表，它将很快获取。正在维护activeCues 列表，并在适当的时间触发事件；轨道的文本也会根据样式和轨道的kind 适当地绘制。如果文本轨道的default 布尔属性已指定，则这是默认值。

默认mode 为 disabled，除非指定了default 布尔属性，在这种情况下，默认mode 为 showing。当文本轨道在 disabled 状态下加载时，相应的 WebVTT 文件不会加载，直到状态更改为 showing 或 hidden。这样，除非实际需要提示，否则可以避免资源获取和内存使用。

但是，这意味着如果您希望在处理（例如，load 事件）时执行任何涉及轨道提示的操作——以便在页面加载时处理提示的某些方面——并且轨道的模式最初为 disabled，则您必须将 mode 更改为 hidden 或 showing 以触发提示的加载。

当模式为 showing 时，将执行文本轨道。该执行的确切外观和方式取决于每个文本轨道的kind。一般来说：

• kind 为 "subtitles" 或 "captions" 的轨道将使用覆盖在视频顶部的提示进行渲染。
• kind 为 "descriptions" 的轨道以非视觉形式呈现（例如，文本可能会被朗读以描述视频中的动作）。
• kind 为 "chapters" 的轨道由用户代理或网站或 Web 应用用于构建和呈现用于导航命名章节的界面，其中列表中的每个提示都表示媒体中的一个章节。然后，用户可以导航到所需的章节，该章节从提示的起始位置开始，到提示的结束位置结束。

在此示例中，我们配置文本轨道的提示，以便每次提示完成时，视频都会自动暂停播放。这是通过将每个提示上的pauseOnExit 属性设置为 true 来完成的。但是，为了确保轨道提示可用，我们首先将 mode 设置为 showing。

window.addEventListener("load", (event) => {
  let trackElem = document.querySelector("track");
  let track = trackElem.track;

  track.mode = "showing";

  for (const cue of track.cues) {
    cue.pauseOnExit = true;
  }
});

• WebVTT
• TextTrack
• TextTrackList
• TextTrackCueList
• VTTCue
• <track>
• HTMLTrackElement