HTML5中“写入音频”实为加载与控制音频资源，核心是标签或JavaScript动态创建Audio对象；支持多格式兼容、动态切换、自动播放限制及跨域处理。
HTML5 中写入音频，核心是使用 标签声明媒体元素，并通过 src 属性指定音频文件路径，或用 JavaScript 动态设置并控制播放。关键不是“写入”文件系统（浏览器无法直接写音频文件到用户硬盘），而是“加载、插入、控制音频资源”。下面分两种常用方式说明：
直接在 HTML 中用
这是最基础、最推荐的静态写入方式，适合页面加载时就确定音频源的场景。
- 基本写法： —— 浏览器自动加载并显示播放控件
- 支持多格式兼容（避免因格式不支持导致播放失败）：
-
注意：src 路径可以是相对路径（如
"./audio/bg.wav"）、绝对路径（"/assets/sound.mp3"）或完整 URL（"https://example.com/audio/alert.mp3"）
用 JavaScript 动态创建并写入 audio 元素
适合需要运行时决定音频、批量生成、响应用户操作（如点击按钮播放不同音效）等场景。
- 创建并插入到页面：
const audio = new Audio();
audio.src = "click.wav";
audio.controls = true;
document.body.appendChild(audio); - 不插入 DOM，仅后台播放（常用于提示音、游戏音效）：
const audio = new Audio("notify.mp3");
audio.play().catch(e => console.warn("播放被阻止，需用户交互后触发")); - 动态切换音频源：
const audio = document.getElementById("myAudio");
audio.src = "new-track.flac";
audio.load(); // 必须调用 load() 才能重新加载新资源
audio.play();
常见问题与注意事项
-
自动播放限制：现代浏览器禁止无用户交互（如点击）时自动播放带声音的音频。可加
muted属性绕过（），但静音状态下才能自动播 -
跨域音频：若音频来自其他域名，服务器需返回
Access-Control-Allow-Origin头，否则 JS 调用play()可能报错 - 格式兼容性：MP3 兼容最好；OGG（Vorbis）开源免费；AAC（.m4a）在 Safari/iOS 表现佳。建议至少提供 MP3 + OGG 双源
-
内存与重复实例：频繁创建
new Audio()不释放可能累积。播放完可设audio.src = ""或复用同一实例
