controlslist 属性支持 nodownload、nofullscreen、noremoteplayback 三个值，仅 nodownload 可隐藏下载按钮；Firefox 125+ 和 Chrome/Edge 支持，Safari 完全不支持，动态设置或第三方播放器框架下可能失效。
controlslist 属性支持哪些值
controlslist 是 <video> 标签的布尔属性，用于控制原生控件面板中哪些按钮可见。它本身不接受 true/false，而是接收空格分隔的字符串列表，每个值代表禁用某项功能。目前主流浏览器（Chrome、Edge、Firefox 125+）支持的合法值有：nodownload、nofullscreen、noremoteplayback。其中只有 nodownload 能隐藏下载按钮。
为什么加了 controlslist="nodownload" 还是能看到下载按钮
常见原因不是写法错，而是浏览器兼容性或 DOM 加载时机问题：
- Firefox 在 124 及更早版本完全忽略
controlslist，必须升级到 125+ 才支持nodownload - Safari 不支持
controlslist任何值，该属性在 Safari 中被静默忽略 - 如果视频是通过 JavaScript 动态插入 DOM 的，需确保
controlslist属性在<video>元素创建时就已存在，而不是后续用setAttribute补上（部分浏览器不响应动态设置） - 某些 CDN 或播放器框架（如 video.js）会接管原生控件，此时
controlslist失效，因为实际渲染的不是原生控件
正确写法和最小验证示例
直接在 HTML 中声明最可靠：
<video controls controlslist="nodownload"> <source src="example.mp4" type="video/mp4"> </video>
注意几点：
立即学习“前端免费学习笔记（深入）”；
-
controls属性必须存在，否则控件面板根本不显示，controlslist就无意义 -
controlslist值必须是纯字符串，不能带引号内的空格（比如"no download"错，"nodownload"对） - 多个禁用项用空格连接，如
controlslist="nodownload nofullscreen" - 不要写成
controlslist="nodownload=true"或:nodownload，这是无效语法
替代方案：当 controlslist 不生效时怎么办
如果目标环境包含 Safari 或旧版 Firefox，仅靠 controlslist 无法隐藏下载按钮，就得绕过原生控件：
- 移除
controls属性，用自定义 UI +HTMLMediaElementAPI 控制播放/暂停/音量等 - 用 CSS 隐藏原生下载按钮（不推荐）：Chrome 中可尝试
video::-webkit-media-controls-overlay-panel button[aria-label="Download"] { display: none; }，但该选择器非标准、易失效且不跨浏览器 - 服务端禁用 MP4 文件的
Content-Disposition: attachment响应头，防止右键另存为——但这不影响控件上的下载按钮，只影响右键菜单
真正可靠的隐藏，取决于你能否放弃 Safari 支持，或者愿意投入开发成本做自定义控件。原生 controlslist 的能力边界很窄，别指望它解决所有场景。
