音频无法播放或页面未更新，主因是audio标签写法错误（缺src路径或controls属性）和浏览器缓存未清除；需确保src为有效路径、添加controls、多格式用source+正确type，并强制刷新或清理各层缓存。
音频插不进去、页面还是旧的，八成是两件事没做对：audio 标签写法不对，或者浏览器缓存没清干净。不是代码有 bug，是这两个环节卡住了。
audio 标签必须带 src 和 controls 才能用
只写 <audio src="sound.mp3"></audio>，页面上根本看不到播放器——它不是静音，是彻底“隐身”。用户点不了、拖不了、调不了音量，等于没放。
-
src必须是相对路径（如"./audio/intro.mp3"）或绝对 URL（如"https://cdn.example.com/song.ogg"），不能是"intro.mp3"这种裸文件名，也不能是file:///协议路径（双击打开 HTML 时 Chrome/Firefox 会直接拒绝加载） - 务必加
controls属性，否则无界面；想自动播，得加autoplay muted，单加autoplay会被浏览器拦截 - 路径错、大小写错、服务器没配
audio/mpegMIME 类型，都会导致控制条显示但点不动，控制台报404或ERR_FAILED
多格式兼容必须用 <source> + 正确 type
只放一个 .mp3，Firefox 用户就听不到；只放 .ogg，Safari 用户可能卡住。浏览器不靠后缀判断格式，靠的是 type 属性。
- MP3 对应
type="audio/mpeg"（不是audio/mp3，那是无效值） - OGG 对应
type="audio/ogg" - 结构必须是：
<audio controls><source src="song.mp3" type="audio/mpeg"><source src="song.ogg" type="audio/ogg">您的浏览器不支持 audio 元素。</audio> - 浏览器按
<source>顺序尝试，遇到第一个能解码且可访问的就停，不用全加载
清理缓存不能只点“刷新”，得绕过或清空三类缓存
改完 HTML 或音频文件后页面还是旧的，不是没保存，是浏览器在“装傻”——它从本地缓存里直接拿了旧 HTML、旧 JS、甚至旧 Service Worker，根本没发请求。
立即学习“前端免费学习笔记（深入）”；
- 普通 F5 刷新没用，必须用
Ctrl+F5（Windows）或Command+Shift+R（Mac）强制重载，跳过所有本地缓存 - 开发调试时，在开发者工具的
Network标签页勾选Disable cache，这个开关只在 DevTools 打开时生效，关了就恢复 - 如果用了
Service Worker（现代 PWA 常见），光清缓存没用：要进Application → Service Workers点Unregister，再进Cache Storage手动删掉对应缓存名 - 旧项目若还残留
AppCache（已废弃），需访问chrome://appcache-internals/手动移除条目
JS 控制播放失败？大概率是触发时机或 Promise 没处理
audio.play() 报 DOMException: play() failed because the user didn't interact with the document first，这不是你代码写错了，是浏览器策略铁律。
- 首次
play()必须由用户手势触发（click、touchstart），不能放在DOMContentLoaded、setTimeout或load事件里 -
play()返回 Promise，必须.catch(e => console.error(e))，否则错误静默消失，你以为没报错，其实根本没播成 -
audio.src改了之后，得手动调audio.load()再play()，不然可能沿用旧缓冲 - iOS Safari 最狠：哪怕点了按钮，如果音频之前从未成功播放过（尤其没
muted过），仍可能拒绝；建议首次用muted=true播一次，再取消静音
最常被忽略的其实是缓存层级：HTTP 缓存、Service Worker 缓存、AppCache、甚至 DNS 缓存都可能各自存一份旧 HTML 或资源。改完代码后页面没变，别急着重写，先确认哪一层缓存还在拦路。
