必须在HTML中同时写死autoplay和muted布尔属性，缺一不可；muted必须无值，否则静音初始化失败；移动端还需加playsinline和preload="metadata"确保可靠播放。
必须在 HTML 标签里写死 autoplay 和 muted，缺一不可，否则静音初始化大概率失败。
为什么只写 autoplay 不行
现代浏览器（Chrome、Safari、Firefox、Edge）默认拦截所有有声自动播放，哪怕视频本身音量为 0 或音频轨道为空。只有显式声明 muted 才被识别为“合规静音”，进而允许 autoplay 生效。单独加 autoplay 的标签，加载后实际处于暂停状态，video.paused 返回 true，且不会触发 play 事件。
-
autoplay是意图声明，不是执行指令；它需要配合muted才能触发真实播放行为 - 部分安卓 WebView 或旧版 iOS Safari 甚至会忽略 JS 后期设置的
autoplay = true，只认初始 HTML 属性 - 服务端渲染（SSR）或框架（如 React/Vue）中动态插入
<video>时，若未在元素挂载前就带muted，也会被浏览器拒绝自动播放
muted 必须是无值布尔属性
muted="true"、muted="muted"、muted="" 全部无效。浏览器只接受纯粹的 muted 关键字存在即生效——这是 HTML5 规范定义的布尔属性行为。
- 错误写法：
<video autoplay muted="true">→ 静音不生效，video.muted仍为false - 正确写法：
<video autoplay muted>→ 加载即静音，video.muted初始化为true - JS 动态创建时，必须用
el.setAttribute('muted', '')或直接赋值el.muted = true，但后者不能替代 HTML 属性对 autoplay 的触发作用
还要补全哪些关键属性才真正可靠
仅靠 autoplay + muted 在移动端或弱网下仍可能白屏卡住。必须同步加上 playsinline 和 preload="metadata"：
-
playsinline：防止 iOS Safari 强制全屏，确保视频嵌入流式布局中正常启动 -
preload="metadata"：只预加载时长、宽高、封面帧，比preload="auto"更快出首帧，减少黑屏等待 - 务必搭配
poster：没有封面图时，iOS 和部分安卓设备会在加载完成前显示空白或黑块，用户易误判失败
JS 动态控制静音状态的边界条件
HTML 属性只管初始化，后续切换必须用 JS 赋值，但受严格交互上下文限制：
-
video.muted = false只能在click、touchstart、keydown等真实用户事件回调里执行，否则会被静默忽略 -
removeAttribute('muted')没用——它只删 DOM 属性，不影响运行时音频通道状态 - 解除静音后必须紧跟着调用
video.play()（即使已在播），并用.catch()捕获NotAllowedError，因为部分场景（如页面后台标签页）仍会失败
最容易被忽略的是：defaultMuted 几乎无用，Firefox 不支持，且对已加载/已播放过的媒体完全无效；真正起作用的只有初始 muted 属性和运行时 video.muted 赋值。
