无<audio>元素时，如何为动态Audio对象加载VTT文本轨道？

无DOM <audio>元素时添加VTT文本轨道的处理方式 #

你用new Audio(src)创建的对象本质是HTMLAudioElement，属于HTMLMediaElement的子类，确实可以调用addTextTrack()创建文本轨道，但无法直接关联外部VTT文件——因为通过<track>元素绑定VTT的方式，要求<track>必须挂载到DOM中的<audio>/<video>元素上，而JS创建的Audio对象默认不在DOM树里，没法绑定<track>元素。

这种情况下，你只能自行解析VTT文件内容：

• 通过fetch()加载VTT文件的文本内容
• 解析内容提取每个提示点的时间、文本等信息
• 逐个创建VTTCue对象，再通过TextTrack.addCue()添加到你创建的文本轨道中

多音频按顺序播放的优化方案 #

复用一个<audio>元素是非常合理的选择，比创建20个独立Audio对象高效得多：

• 在HTML中预先定义一个隐藏的<audio>元素（比如设置style="display:none"）
• 每次切换音频时，更新<audio>的src属性，同时移除旧的文本轨道，再为新音频绑定对应的VTT（可以直接创建<track>元素挂载到这个<audio>上，或者解析VTT后添加Cue）
• 监听<audio>的ended事件，触发下一个音频的加载与播放逻辑，实现按顺序播放的需求

内容的提问来源于stack exchange，提问作者Rooster242