以编程方式加载音频文本轨道

Question

来自 WebVTT API 文档

可以使用 WebVTT 文件在文件中定义文本轨道和提示 格式化，然后使用与特定的

<video>

元素关联

<track>

元素。

或者，您可以在 JavaScript 中将 TextTrack 添加到媒体元素 使用 HTMLMediaElement.addTextTrack()，然后添加单独的 VTTCue 使用 TextTrack.addCue() 将对象添加到轨道。

我有一个 vtt 文件，并且我正在使用

new Audio(src);

，html 中没有

<audio>

元素。是否无法在没有实际 <audio> 元素的情况下使用 vtt file 添加文本轨道，还是我必须自己解析 vtt 文件并为文件中定义的每个提示调用 addCue？

我没有使用

<audio>

元素，因为我需要加载大约 20 个音频文件（带有 vtt 文件）并按特定顺序播放它们。也许我可以拥有一个

<audio>

元素并重复使用它？

Answer 1

您可以通过编程方式创建

<track>

元素。

const a = new Audio('woot.webm');
const t = document.createElement('track');
t.src = 'subtitles.webvtt';
a.appendChild(t);

也许我可以拥有一个元素并重复使用它？

是的，出于多种原因，这就是我会做的。 其中最重要的是，如果您想要 iOS 兼容性，您必须这样做。 否则，iPhone 将拒绝依次播放后续曲目。