结论：<track>标签本身不维护多语言，它只声明轨道；真正需维护的是WebVTT文件、srclang值一致性、服务端MIME类型及JS切换逻辑——任一环节出错，字幕菜单即失效。
直接说结论：<track> 标签本身不维护多语言，它只声明轨道；真正需要维护的是 WebVTT 文件、srclang 值一致性、服务端 MIME 类型，以及 JS 切换逻辑——漏掉任一环，用户就看不到对应语言的字幕菜单。
WebVTT 文件必须按语言拆分且格式零容错
每个语言一个 .vtt 文件，不是“一份文件里写多语种”，浏览器不解析嵌套语言。常见错误是把中英混排进同一份 VTT，指望靠 CSS 或 JS 拆分——无效。
- 首行必须是顶格、全大写、无空格、无 BOM 的
WEBVTT，写成webvtt或WEBVTT（末尾空格）都会静默失败 - 时间戳严格为
00:01:23.456 --> 00:01:25.789：小时/分/秒两位，毫秒三位，箭头前后各一个空格 - 中文/日文/阿拉伯文等需 UTF-8 无 BOM 编码，Windows 记事本默认带 BOM，务必用 VS Code 保存为 “UTF-8 without BOM”
- 内容里不能写
<b>或<i>，Safari 会原样输出；如需样式，用::cue或<c.zh>+ CSS 控制
srclang 必须与文件实际语言一致且合法
srclang 不是给人看的备注，而是浏览器匹配系统语言或用户手动选择的唯一依据。拼错、用错格式，等于该轨道在 UI 中“不存在”。
- 简体中文用
zh-Hans，不是zh-CN（虽部分浏览器兼容，但 BCP 47 规范推荐前者） - 繁体中文用
zh-Hant，不是zh-TW或Chinese - 英文必须是
en，不是eng、english或空值 - 同一视频内所有
srclang值不能重复，否则第二个起会被忽略
<track> 必须作为 <video> 直接子元素且位置固定
浏览器只在 <video> 开始标签后、所有 <source> 闭合后、</video> 前解析 <track>。放错位置，video.textTracks.length 就是 0，控制台不报错，调试器里也看不到轨道。
立即学习“前端免费学习笔记（深入）”；
- 错误写法：
<div><track src="zh.vtt"></div>、<track>写在<source>前、写在</video>外 - 正确结构：
<video><source src="x.mp4"><track kind="subtitles" srclang="zh" src="zh.vtt"><track kind="subtitles" srclang="en" src="en.vtt"></video> - JS 动态插入
<track>无效——必须随 HTML 一起加载，不能appendChild到已渲染的<video>
服务端响应头和本地开发环境最容易被忽略
即使 HTML 和 VTT 全对，.vtt 文件返回 text/plain 或走 file:// 协议，字幕照样不加载。这不是前端代码问题，是部署或开发流程问题。
- 服务器必须返回
Content-Type: text/vtt，Apache/Nginx 需显式配置，IIS 要加 MIME 类型映射 - 本地开发时禁用
file://协议预览：Chrome/Firefox 默认阻止跨文件请求，npx serve、python3 -m http.server或 VS Code Live Server 是刚需 - 检查 Network 面板：确认
zh.vtt请求状态码为 200，Response Headers 含Content-Type: text/vtt - 跨域场景下，服务端还需返回
Access-Control-Allow-Origin: *，否则 Safari 直接拒绝加载
真正麻烦的不是写几个 <track> 标签，而是每新增一种语言，就要同步验证四件事：VTT 文件是否合规、srclang 是否准确、路径是否可访问、服务端是否返回正确 MIME 类型——少验一项，那个语言就永远不出现在字幕菜单里。
