track标签必须嵌套在video标签内且不可自闭合；src需为有效可访问的UTF-8无BOM WebVTT文件，格式须严格符合标准（含WEBVTT声明、正确时间戳、空行）；srclang须遵循BCP 47；default仅表示默认选中，用户仍需手动开启字幕；iOS Safari存在兼容限制，需真机测试或采用外挂方案。
track 标签必须嵌套在 video 标签内部，且不能自闭合
直接写 <track></track> 或放在 <video></video> 外面，字幕根本不会加载。浏览器只认嵌套在 <video></video> 开始标签和结束标签之间的 <track></track> 元素。
- 正确写法：
<video controls> <source src="movie.mp4" type="video/mp4"> <track kind="subtitles" label="English" srclang="en" src="en.vtt" default> <track kind="subtitles" label="中文" srclang="zh" src="zh.vtt"> </video>
-
src必须是有效可访问的 .vtt 文件路径（相对或绝对），404 会导致字幕静默失败，控制台通常不报错 -
srclang值要符合 BCP 47 标准（如zh、zh-CN、en-US），填ch或cn会导致浏览器忽略该 track
vtt 文件格式稍有错误，字幕就完全不显示
WebVTT 不是纯文本随便写写就行。哪怕第一行少了 WEBVTT 声明，或时间戳格式错一位（比如用 , 代替 .），整个文件都会被丢弃。
- 最小合法 vtt 示例：
WEBVTT 00:00:01.000 --> 00:00:04.000 Hello, this is English. 00:00:05.000 --> 00:00:08.000 How are you today?
- 注意：空行必需，时间戳必须是
HH:MM:SS.mmm格式，-->两侧有空格 - UTF-8 编码 + 无 BOM，用记事本保存容易带 BOM，推荐用 VS Code 或 Sublime Text 保存为 “UTF-8”（明确不含 BOM）
浏览器默认不自动启用字幕，用户需手动开启
default 属性只表示“默认选中”，不代表“默认显示”。用户仍需点击视频右下角字幕图标（? 图标）并选择对应语言，字幕才真正浮现。
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 如果希望首次播放即显示，除了加
default，还需确保：<video></video>有controls属性，且用户没在浏览器设置里禁用字幕 - JavaScript 动态启用：用
video.textTracks[0].mode = 'showing'可强制显示第一个字幕轨（但需等loadedmetadata事件后操作） - 多个
kind="subtitles"轨道互斥，同一时间只能有一个处于showing状态
移动端 Safari 对 track 支持有限，尤其 iOS 16 以前
iOS Safari 默认隐藏字幕控件，即使写了 <track></track> 且 vtt 正确，用户也找不到开关入口 —— 这不是你代码的问题，是系统限制。
立即学习“前端免费学习笔记（深入）”；
- 真机测试必备：iOS 模拟器不可靠，必须用真实 iPhone/iPad 验证
- 兼容方案：提供外挂字幕按钮 + 自定义渲染层（用 JavaScript 解析 vtt 并 overlay div），但成本高
- 替代思路：对关键内容，把字幕文字同步写进页面下方
<div class="subtitle-display">，用 JS 同步 video.currentTime 更新内容 实际部署时，最常卡在 vtt 文件编码或路径 404，而不是 HTML 结构本身。先 curl 或直接浏览器访问 <code>zh.vttURL，确认能打开且格式干净，再调 HTML。
