©
本文档使用
php.cn手册 发布
该HTML 元素用于嵌入文档中的声音内容。它可能包含一个或多个音频源,用src<source>
属性或<audio>
元素表示:浏览器将选择最合适的一个。它也可以是流媒体的目的地,使用一个MediaStream。
内容类别 | 流内容,短语内容,嵌入式内容。如果它具有控件属性:交互式内容和可触及的内容。 |
---|---|
允许的内容 | 如果元素具有src属性:零个或多个<track>元素,后跟不包含媒体元素的透明内容,即不包含<audio>或<video>元素:零个或多个<source>元素,后跟零或更多<track>元素,后面是不包含媒体元素的透明内容,即不包含<audio>或<video>。 |
标记遗漏 | 没有,起始和结束标签都是强制性的。 |
允许父母 | 任何接受嵌入内容的元素。 |
允许ARIA角色 | 应用 |
DOM界面 | HTMLAudioElement |
该元素包含 全局属性。
autoplay
布尔属性;如果指定(默认值为"false"!);指定后,音频会马上自动开始播放,不会停下来等着数据载入结束。
自动播放音频(或带音轨的视频)的站点对于用户来说可能是一个不愉快的体验,所以应尽可能避免。如果您必须提供自动播放功能,您应该选择启用(要求用户专门启用它)。但是,在用户控制下创建媒体元素的源将在稍后设置时,这可能是有用的。
buffered
你可以通过该属性获取已缓冲的资源的时间段信息。该属性包含一个 TimeRanges
对象。
controls
如果设置了该属性,浏览器将提供一个包含声音,播放进度,播放暂停的控制面板,让用户可以控制音频的播放。
loop
布尔属性;如果指定,将循环播放音频。
mozCurrentSampleOffset
在音频播放时,表示相对于音频开始处的偏移量的一个数值。
muted
表示是否静音的布尔值。默认值为false,表示有声音。
played
一个TimeRanges
对象,表示所有已播放的音频片段。
preload
枚举属性,让开发者自行思考来示意浏览器使用何种加载方式以达到最好的用户体验。可以是以下属性之一:
none
: 示意用户可能不会播放该音频,或者服务器希望节省带宽;换句话说,该音频不会被缓存;
metadata
: 示意即使用户可能不会播放该音频,但获取元数据 (例如音频长度) 还是有必要的。
auto
: 示意用户可能会播放音频;换句话说,如果有必要,整个音频都将被加载,即使用户不期望使用。
空字符串 : 等效于auto
属性。
假如不设置,默认值就是浏览器定义的了(不同浏览器会选择自己的默认值), 即使规范建议设置为 metadata
.
使用备注:
autoplay
属性优先于 preload
假如用户想自动播放视频,那么很明显浏览器需要下载视频。同时设置autoplay
和 preload
属性在规范里是允许的。
规范没有强制浏览器去遵循该属性的值;这仅仅只是个提示。
src
嵌入的音频的URL。 该URL应遵从 HTTP access controls. 这是一个可选属性;你可以在audio元素中使用 <source>
元素来替代该属性指定嵌入的音频。
volume
音频播放的音量。值从0.0 (无声) 到 1.0 (最大声).
时间偏移量目前是指定为float类型的值,表示偏移的秒数。
备注: HTML 5 规范中,时间偏移量值的定义还没有完成,有可能会变更。
audio元素支持的事件
基本用法
不支持<audio>
元素的浏览器的其他内容可以添加到开始和结束<audio></audio>
标记中。
最基本的播放功能可以使用该controls
属性(见下面的示例); 对于更高级的用法,可以使用HTML Media API操作音频播放和控件,更具体地说,可以使用HTMLAudioElement
界面中定义的功能。
您也可以使用Web Audio API来直接生成和处理来自JavaScript代码的音频流。
虽然HTML5 <video>
可以通过<track>
添加字幕(请参阅将标题和字幕添加到HTML5视频),但<audio>
元素不能 : 忽略标签<track>
内包含的任何<audio></audio>
元素。请参阅Ian Devlin的WebVTT和Audio获取更多有用的信息和解决方法。
<!-- Simple audio playback --><audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg" autoplay> Your browser does not support the <code>audio</code> element.</audio>
<audio controls="controls"> Your browser does not support the <code>audio</code> element. <source src="foo.wav" type="audio/wav"></audio>
规范 | 状态 | 评论 |
---|---|---|
HTML Living Standard该规范中'<audio>'的定义。 | 生活水平 | |
HTML5该规范中'<audio>'的定义。 | 建议 |
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 3.0 | (Yes) | 3.5 (1.9.1) 1 | 9.0 | 10.5 | 3.1 |
autoplay attribute | 3.0 | (Yes) | 3.5 (1.9.1) | 9.0 | 10.5 | 3.1 |
buffered attribute | ? | (Yes) | 4.0 (2.0) | ? | ? | ? |
controls attribute | 3.0 | (Yes) | 3.5 (1.9.1) | 9.0 | 10.5 | 3.1 |
loop attribute | 3.0 | (Yes) | 11.0 (11.0) | 9.0 | 10.5 | 3.1 |
muted attribute | ? | (Yes) | 11.0 (11.0) | ? | ? | ? |
played property | 49 | 14 | 15.0 (15.0) | 11 | 46 | 9.1 |
preload attribute | 3.0 | (Yes) | 4.0 (2.0) | 9.0 | (Yes) 2 | 3.1 |
src attribute | 3.0 | (Yes) | 3.5 (1.9.1) | 9.0 | 10.5 | 3.1 |
volume attribute | (Yes) |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | ? | (Yes) | 1.0 (1.0) 1 | ? | ? | ? |
autoplay attribute | ? | (Yes) | 1.0 (1.0) | ? | ? | ? |
buffered attribute | ? | (Yes) | 4.0 (2.0) | ? | ? | ? |
controls attribute | ? | (Yes) | 1.0 (1.0) | ? | ? | ? |
loop attribute | ? | (Yes) | 11.0 (11.0) | ? | ? | ? |
muted attribute | ? | (Yes) | 11.0 (11.0) | ? | ? | ? |
played property | ? | (Yes) | 15.0 (15.0) | ? | ? | ? |
preload attribute | ? | (Yes) | 4.0 (2.0) | ? | ? | ? |
src attribute | ? | (Yes) | 1.0 (1.0) | ? | ? | ? |
volume attribute | (Yes) |