微信内置浏览器不支持track标签——因其X5内核未实现TextTrack API，video.textTracks为空且不触发加载；需手动解析VTT+timeupdate动态渲染字幕。

track 元素在微信内置浏览器里基本不可用——不是“不推荐”，是根本不会渲染字幕、章节或描述信息，video 播放时 track 标签被完全忽略。

为什么微信浏览器不支持 track 标签

微信内置浏览器（X5内核）对 HTML5 媒体标准的支持存在长期断层：它未实现 TextTrack API，video.textTracks 返回空列表，load 事件也不触发 track 加载逻辑。实测 iOS 微信 8.0.50+ 和 Android 微信 8.0.48+ 均无例外。

• 不是兼容性开关问题，而是底层 WebKit 分支未启用该特性
• 即使 写得完全合规，控制台也看不到任何错误，只是静默失效
• Chrome DevTools 模拟微信 UA 也无法复现，必须真机调试

替代方案：用 canvas + WebVTT 解析手动渲染字幕

要让字幕在微信里显示，只能绕过原生 track，自己解析 VTT 文件并叠加 DOM 或 Canvas 层。

DeepBI DHTML 页面生成器

生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur

下载

• 用 fetch('zh.vtt') 获取字幕文本，再用正则或 vtt.js 库解析时间轴和内容
• 监听 video 的 timeupdate 事件，比对当前播放时间，动态更新
  的 innerHTML
• 关键兼容点：iOS 微信中 timeupdate 触发频率极低（约 0.5s 一次），需加防抖 + 预加载缓冲区
• 样式上避免使用 position: fixed，改用 position: absolute + transform: translateZ(0) 强制硬件加速，防止 iOS 字幕闪烁

微信 H5 页面适配 video + 字幕的工程建议

若项目已依赖 track，上线前必须重构；若新做，直接放弃原生方案。

• 不要把字幕内容硬编码进 HTML，统一走 JSON 或 VTT 接口，便于多语言切换
• 微信环境检测可写成：const isWechat = /MicroMessenger/i.test(navigator.userAgent)，仅对 true 场景启用手动字幕逻辑
• 音频类 H5（如课程页、播客页）建议优先用 audio + 文字稿折叠展开，避开视频字幕坑
• 若必须用视频且需强交互（如点击字幕跳转时间点），用 span 包裹每句字幕，绑定 click 事件调 video.currentTime = xxx

微信里想靠 track 实现字幕，等于指望自行车跑高速——结构上就不支持。真正落地的方案，永远是从「它不做什么」出发，而不是「W3C 规范说它该做什么」。