controlslist 属性在 chrome 中仅部分生效且仅支持“nodownload”等三个值，firefox 和 safari 完全忽略；它非强制性，无法真正隐藏核心控件，可靠方案是移除 controls 属性并自定义控件。
controlslist 属性在 Chrome 中是否有效
只在 Chromium 系统（Chrome、Edge、新版 Opera）中部分生效，且仅支持有限值；Firefox 和 Safari 完全忽略该属性，不报错也不起作用。它不是跨浏览器隐藏控制条的可靠方案，本质是「提示性」而非「强制性」属性。
-
controlslist是<video></video>的布尔型 HTML 属性，但必须显式赋值为特定字符串（如"nodownload"），不能只写controlslist - 合法值只有
"nodownload"、"nofullscreen"、"noremoteplayback"三种（Chrome 78+），其他如"hidecontrols"或空字符串均被忽略 - 即使设置了
controlslist="nodownload nofullscreen"，播放/暂停、音量、时间轴等核心按钮仍会显示，无法隐藏
想真正隐藏所有控制条按钮，该用什么
必须放弃 controlslist，改用 controls 属性 + 自定义控件组合。原生控制条不可“部分隐藏”，只有“全有”或“全无”两种状态。
- 移除
controls属性：直接删掉<video controls></video>中的controls，此时视频默认无任何按钮 - 若需保留某几个功能（如仅允许播放/暂停），需手写
<button></button>+ 监听play、pause事件 + 调用video.play()/video.pause() - 注意：自定义控件需手动处理移动端点击延迟、键盘焦点、无障碍（
aria-label）等问题，不能只靠样式隐藏
为什么 controlslist="nodownload" 有时看起来“没反应”
常见于开发环境未启用 HTTPS 或本地 file:// 协议打开页面 —— Chrome 在非安全上下文中会禁用 controlslist 的全部能力，包括下载按钮抑制。
- 检查控制台是否出现警告：
controlslist is not supported in insecure contexts - 确保服务运行在
http://localhost或真实 HTTPS 域名下（127.0.0.1可接受，但file://不行） - 即使环境安全，右键菜单中的“另存为视频”仍存在，
controlslist仅影响右下角下载按钮，不影响上下文菜单
替代方案对比：CSS 隐藏 vs JS 控制 vs 属性组合
用 CSS 强制隐藏 .video::-webkit-media-controls 类似选择器看似简单，但极不稳定：Chrome 版本一更新就失效，且破坏可访问性；而纯 JS 模拟又过于重。最务实的做法是明确取舍：
- 只要求隐藏下载按钮 → 用
controlslist="nodownload"+ HTTPS 环境，其余不管 - 要求彻底无控制条 → 移除
controls，用poster图 + 显式video.play()触发（如点击封面） - 需要精细控制（如禁用全屏但保留音量）→ 必须放弃原生控件，用
video.disableRemotePlayback = true+ 自定义 UI 实现
别指望一个 HTML 属性解决所有交互需求，controlslist 的设计定位就是轻量级提示，不是控制权移交。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
