声音在HTML中能够以区别的方式播放.
问题以及处理办法
在 HTML 中播放音频并不易！
您需要谙熟海量技巧，以保证您的音频文件在所有浏览器中（Internet Explorer, Chrome, Firefox, Safari, Opera）和所有硬件上（PC, Mac , iPad, iPhone）都能够播放。
在这W3CSchool 为您总结了问题和处理办法。
运用插件
浏览器插件是一种扩展浏览器标准功能的小型计算机程序。
插件能够运用 <object> 标签 或 <embed> 标签添加在页面上.
这些标签定义资源（一般非 HTML 资源）的容器，按照类型，它们即会由浏览器表示，亦会由外边插件显示。
运用 <embed> 元素
<embed>标签定义外边（非 HTML）内容的容器。（这是一个 HTML5 标签，在 HTML4 中是违法的，然则所有浏览器中都有效）。
下面的代码片段能够表示嵌入网页中的 MP3 文件：
实例
<embed height="50" width="100" src="horse.mp3">
问题:
<embed> 标签在 HTML 4 中是无效的。页面没法经过 HTML 4 验证。
区别的浏览器对音频格式的支持亦区别。
倘若浏览器不支持该文件格式，无插件的话就没法播放该音频。
倘若用户的计算机未安装插件，没法播放音频。
倘若把该文件转换为其他格式，仍然没法在所有浏览器中播放。
使用 <object> 元素
<object tag> 标签亦能够定义外边（非 HTML）内容的容器。
下面的代码片段能够表示嵌入网页中的 MP3 文件：
实例
<object height="50" width="100" data="horse.mp3"></object>
问题:
区别的浏览器对音频格式的支持亦区别。
倘若浏览器不支持该文件格式，无插件的话就没法播放该音频。
倘若用户的计算机未安装插件，没法播放音频。
倘若把该文件转换为其他格式，仍然没法在所有浏览器中播放。
运用 HTML5 <audio> 元素
HTML5 <audio> 元素是一个 HTML5 元素，在 HTML 4 中是违法的，但在所有浏览器中都有效。
The <audio> element works in all modern browsers.
以下咱们将运用 <audio> 标签来描述 MP3 文件(Internet Explorer、Chrome 以及 Safari 中是有效的), 一样添加了一个 OGG 类型文件(Firefox 和 Opera浏览器中有效).倘若失败，它会表示一个错误文本信息:
实例
<audio controls>
<source src="horse.mp3" type="audio/mpeg">
<source src="horse.ogg" type="audio/ogg">
Your browser does not support this audio format.
</audio>
问题:
<audio> 标签在 HTML 4 中是无效的。您的页面没法经过 HTML 4 验证。
您必须把音频文件转换为区别的格式。
<audio> 元素在老式浏览器中不起功效。
最好的 HTML 处理办法
下面的例子运用了两个区别的音频格式。HTML5 <audio> 元素会尝试以 mp3 或 ogg 来播放音频。倘若失败，代码将回退尝试 <embed> 元素。
实例
<audio controls height="100" width="100">
<source src="horse.mp3" type="audio/mpeg">
<source src="horse.ogg" type="audio/ogg">
<embed height="50" width="100" src="horse.mp3">
</audio>
问题:
您必须把音频转换为区别的格式。
<embed> 元素没法回退来表示错误信息。
雅虎媒介播放器 - 一个简单的添加音频到你网站上的方式
运用雅虎播放器是免费的。如需运用它，您需要把这段 JavaScript 插进网页底部：
雅虎播放器能够播放MP3以及其他各样格式。你只需添加一行代码到你的页面或 博客中就能够容易地将您的HTML页面制作成 专业的播放列表：
实例
<a href="horse.mp3">
lay Sound</a>
<script src="http://mediaplayer.yahoo.com/latest"></script>
倘若你要运用它，您需要把这段 JavaScript 插进网页底部：
<script src="http://mediaplayer.yahoo.com/latest"></script>
而后只需简单地把 MP3 文件链接到您的 HTML 中，JavaScript 会自动地为每首歌创建播放按钮：
<a href="song1.mp3">lay Song 1</a>
<a href="song2.wav">lay Song 2</a>
...
...
雅虎媒体播放器为您的用户供给的是一个小型的播放按钮，而不是完整的播放器。不外，当您点击该按钮，会弹出完整的播放器。
请重视，这个播放器始终停靠在窗框底部。只需点击它，就可将其滑出。
运用超链接
倘若网页包括指向媒介文件的超链接，大都数浏览器会运用"辅助应用程序"来播放文件。
以下代码片段表示指向 mp3 文件的链接。倘若用户点击该链接，浏览器会起步"辅助应用程序"来播放该文件：
实例
<a href="horse.mp3">lay the sound</a>
内联的声音说明
当您在网页中包括声音，或做为网页的构成部分时，它被叫作为内联声音。
倘若您打算在 web 应用程序中运用内联声音，您需要认识到非常多人都觉得内联声音令人恼火。同期请重视，用户可能已然关闭了浏览器中的内联声音选项。
咱们最好的意见是仅在用户期盼听到内联声音的地区包括它们。一个正面的例子是，在用户需要听到录音并点击某个链接时，会打开页面而后播放录音。
HTML 多媒介标签
New : HTML5 新标签
标签描述<embed>定义内嵌对象。HTML4 中不赞成，HTML5 中
准许。<object>定义内嵌对象。<param>定义对象的参数。<audio>New定义了声音内容<video>New定义一个视频
或影片<source>New定义了media元素的多
媒介资源(<video> 和 <audio>)<track>New规定media元素的字幕文件或其他
包括文本的文件 (<video> 和<audio>)
如您还有不明白的能够在下面与我留言或是与我探讨QQ群308855039，咱们一块飞！
发表于 2024-10-3 11:11:11