audio元素的volume属性只能设0–1之间的小数，且必须为数字类型；设置前需确保音频已加载或用户已交互；静音应优先使用muted属性；iOS等平台限制JS音量调节为相对值而非绝对值。
audio元素的volume属性只能设0–1之间的小数
HTML 标签本身没有volume属性，真正起作用的是其对应的 DOM 元素的 volume 属性，取值范围固定为 0.0（静音）到 1.0（最大音量），不能填百分比、整数或超过1的值。
常见错误是写成 audio.volume = 80 或 audio.volume = "0.8"（字符串），虽然部分浏览器会隐式转换，但不可靠；必须用数字类型：
const audio = document.querySelector('audio');
audio.volume = 0.75; // ✅ 正确
audio.volume = 75 / 100; // ✅ 同样正确
audio.volume = '0.75'; // ⚠️ 不推荐，依赖隐式转换
设置volume前必须确保音频已加载或可播放
刚创建或尚未触发加载的 元素，直接设 volume 可能无效，尤其在 iOS Safari 或某些安卓 WebView 中——这些环境要求用户主动交互（如点击）后才允许修改音量。
- 监听
canplay或loadedmetadata事件后再赋值更稳妥 - 若需初始化音量，建议在用户首次点击播放按钮时统一设置
- 避免在
DOMContentLoaded里就设volume，此时资源大概率未就绪
audio.addEventListener('canplay', () => {
audio.volume = 0.6;
});
静音控制优先用muted属性，别只调volume=0
单纯设 volume = 0 仍可能被系统策略阻止（比如 iOS 要求“有声源”才能播放），而 muted = true 是明确的静音指令，兼容性更好，且能绕过部分平台的自动播放限制。
实际使用中建议组合处理：
- 需要彻底静音 → 设
audio.muted = true - 需要调节音量 → 先确保
audio.muted = false，再设volume - 用户点击“静音按钮”时，优先 toggle
muted，而不是仅改volume
注意iOS和部分安卓WebView的特殊限制
iOS Safari 对 的音量控制极其保守：即使 JS 设置了 volume，最终输出音量仍由系统媒体音量滑块决定，JS 无法突破这个上限。也就是说，volume = 0.5 在 iOS 上只是“相对降低”，不是绝对音量值。
另外，以下情况会导致 volume 设置失败或被忽略：
- 音频尚未获得播放权限（未响应用户手势）
- 页面处于后台标签页，且音频未设
loop或未触发过播放 - 使用了
preload="none"，又没等加载完成就操作
真正在意跨端一致性的话，得接受 JS 只能做“相对调节”，不能当硬件音量控制器用。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
