default属性不能让字幕默认显示，仅在页面首次加载、无用户干预、唯一subtitles轨道、srclang匹配且src加载成功等严苛条件下才可能启用；应改用JS监听loadedmetadata后设mode="showing"。
default 属性不能让字幕“默认显示”，它只在极窄条件下可能让某条 <track></track> 进入 mode = "showing" 状态，且一旦用户点过字幕开关就永久失效。别把它当开关用，得靠 JS 控制。
为什么加了 default 却没显示字幕
这不是你写错了，是浏览器根本没按你想的执行。常见原因包括：
-
srclang值不合法：比如写成zh-CN，但用户系统语言是zh；或拼错为chinese - 多个
<track></track>都写了default→ 多数浏览器直接忽略全部，或只启用第一个（行为未定义） -
kind不是"subtitles"（例如用了"captions"），Safari 等浏览器不对其应用default逻辑 -
src对应的 .vtt 文件返回 404、CORS 错误，或服务端没返回text/vttMIME 类型 → 轨道加载失败，default失去作用对象 - 视频尚未触发
loadedmetadata事件，video.textTracks还为空，浏览器来不及处理default
default 属性的真实生效条件
它不是“默认打开”，而是一个初始状态信号，仅当同时满足以下全部条件时才可能启用：
- 页面首次加载，且用户从未点击过播放器上的字幕开关（包括关闭、切换、静音字幕等）
- 该
<track></track>的kind="subtitles"且srclang是有效 BCP 47 语言码（如zh、en-US） -
src可成功加载（HTTP 200 +text/vttMIME） - 同一
<video></video>中只有一个<track></track>带default属性 - 不在 Safari 私密模式下 —— 此时连
<track></track>节点都可能被跳过解析
真正可控的默认启用方式：用 JS 主动设 mode
绕过 default 的不确定性，监听 loadedmetadata 后手动匹配并启用：
立即学习“前端免费学习笔记（深入）”；
video.addEventListener('loadedmetadata', () => {
const lang = navigator.languages?.[0] || document.documentElement.lang || 'zh';
const targetTrack = Array.from(video.textTracks).find(track =>
track.kind === 'subtitles' &&
(track.srclang === lang || track.srclang.startsWith(lang.split('-')[0]))
);
if (targetTrack) {
targetTrack.mode = 'showing';
Array.from(video.textTracks)
.filter(t => t !== targetTrack && t.kind === 'subtitles')
.forEach(t => t.mode = 'disabled');
}
});
注意：textTracks 是实时集合，必须等 loadedmetadata 触发后才能遍历；mode 只能设为 "disabled"、"hidden" 或 "showing"；设 "showing" 前要确保轨道已加载完成（track.readyState === 2），否则无效。
最易被忽略的一点：即使 JS 设置了 mode = "showing"，如果用户之前手动关闭过该轨道（哪怕只是点了一下再关掉），部分浏览器会记住这个偏好，后续仍拒绝显示——此时需配合播放器 UI 重置逻辑或 localStorage 记录用户显式选择。
