最简可用audio结构为<audio src="./audio/ending.mp3" controls></audio>；需用相对路径、确保文件存在且大小写匹配；本地双击打开会因file://协议被拦截，应使用http服务；自动播放必须加muted；MP3需配合<source>提供多格式回退；JS调用play()须在用户交互事件中触发并捕获Promise错误。
audio 标签直接放 </body> 前就能用，但得加 controls
不加 controls 的 <audio> 在页面底部是“隐形”的——没按钮、不能点、也不报错，用户根本不知道它存在。最简可用结构就是：<audio src="./audio/ending.mp3" controls></audio>。注意三点：
• src 必须是相对路径（如 "./audio/ending.mp3"）或绝对 URL，不能写成 "ending.mp3" 或 file:/// 路径
• 音频文件得实际放在对应目录里，大小写也要完全匹配（"Ending.mp3" 和 "ending.mp3" 是两个文件）
• 直接双击 HTML 打开时，Chrome/Firefox 会因 file:// 协议拒绝加载，建议用 python -m http.server 起本地服务验证
想自动播放？必须加 muted，且不能只靠 autoplay
autoplay 单独存在基本无效，现代浏览器（Chrome 94+、Safari、Edge）默认拦截有声自动播放。真正能落地的写法是：<audio src="./audio/ending.mp3" controls autoplay muted></audio>。这意味着：
• 加了 muted 才可能触发自动播放（哪怕你后续用 JS 解除静音）
• iOS Safari 最严：即使 muted，首次加载也需用户点击过页面才能解锁音频能力
• 如果你非要“有声自动播”，就得在用户 click/touchstart 后立刻调用 play()，且不能包在 setTimeout 或异步逻辑里
MP3 播不了？不是浏览器问题，是格式没兜底
只放一个 .mp3 文件，在 Firefox 或旧版 Safari 上大概率显示“无法加载媒体”。这不是 bug，是规范行为。正确做法是用 <source> 提供多格式回退：
• <source src="ending.mp3" type="audio/mpeg">（MP3 兼容最广）
• <source src="ending.ogg" type="audio/ogg">（体积小、开源、Chrome/Firefox/Edge 均支持）
• type 属性不能省，也不能写错（"audio/mp3" 是无效值）
• 浏览器按 <source> 顺序尝试，遇到第一个能解码且可访问的就停
JS 控制播放总失败？检查这三处硬性限制
常见报错 DOMException: play() failed because the user didn't interact with the document first，本质是策略拦截，不是代码写错：
• play() 必须在用户显式交互事件（click、touchstart）回调中首次调用，不能放在 DOMContentLoaded 或页面加载完成钩子里
• play() 返回 Promise，必须 .catch(e => console.error(e)) 捕获拒绝，否则错误静默消失
• 别反复调用 play()：若 audio.paused === false，应先 pause() 再处理，否则抛错
立即学习“前端免费学习笔记（深入）”；
底部音频最容易被忽略的是 MIME 类型配置和移动端弱网下的 canplaythrough 事件不可靠——它可能永不触发，建议加 8 秒超时兜底。
