HTML5中audio标签的使用

html-css07

HTML5中audio标签的使用,第1张

HTML5 中的新元素标签

src:音频文件路径。

autobuffer:设置是否在页面加载时自动缓冲音频。

autoplay:设置音频是否自动播放。

loop:设置音频是否要循环播放。

controls:属性供添加播放、暂停和音量控件。

这些属性和<video>元素标签的属性很类似

常用的控制函数:

1.load():加载音频、视频软件

2.play():加载并播放音频、视频文件或重新播放暂停的的音频、视频

3.pause():暂停出于播放状态的音频、视频文件

4.canPlayType(obj):测试是否支持给定的Mini类型的文件

可脚本控制的属性值:

1.autoplay:自动播放已经加载的的媒体文件

2.loop为true:的时候则设定为自动播放

3.currentTime:以s为单位返回从开始播放到目前所花的时间

4.controls:显示或者隐藏用户控制界面

5.volume:音量值,从0.0至1.0之间

6.muted:设置是否静音

7.autobuffer:是否进行缓冲加载

audioTracks返回表示可用音频轨道的 AudioTrackList 对象。

autoplay 设置或返回是否在就绪(加载完成)后随即播放音频。

buffered 返回表示音频已缓冲部分的 TimeRanges 对象。

controller 返回表示音频当前媒体控制器的 MediaController 对象。

controls 设置或返回音频是否应该显示控件(比如播放/暂停等)。

crossOrigin设置或返回音频的 CORS 设置。

currentSrc 返回当前音频的 URL。

currentTime设置或返回音频中的当前播放位置(以秒计)。

defaultMuted 设置或返回音频默认是否静音。

defaultPlaybackRate 设置或返回音频的默认播放速度。

duration返回音频的长度(以秒计)。

ended 返回音频的播放是否已结束。

error 返回表示音频错误状态的 MediaError 对象。

loop设置或返回音频是否应在结束时再次播放。

mediaGroup 设置或返回音频所属媒介组合的名称。

muted 设置或返回是否关闭声音。

networkState返回音频的当前网络状态。

paused 设置或返回音频是否暂停。

playbackRate设置或返回音频播放的速度。

played 返回表示音频已播放部分的 TimeRanges 对象。

preload 设置或返回音频的 preload 属性的值。

readyState 返回音频当前的就绪状态。

seekable返回表示音频可寻址部分的 TimeRanges 对象。

seeking 返回用户当前是否正在音频中进行查找。

src 设置或返回音频的 src 属性的值。

textTracks 返回表示可用文本轨道的 TextTrackList 对象。

volume 设置或返回音频的音量。

方法 描述

addTextTrack() 向音频添加新的文本轨道。

canPlayType() 检查浏览器是否能够播放指定的音频类型。

fastSeek() 在音频播放器中指定播放时间。

getStartDate()返回新的 Date 对象,表示当前时间线偏移量。

load() 重新加载音频元素。

play()开始播放音频。

pause() 暂停当前播放的音频。

一共支持三种格式: Ogg、MPEG4、WebM。

相关介绍:

1、MP4 = MPEG 4文件使用 H264 视频编解码器和AAC音频编解码器

2、WebM = WebM 文件使用 VP8 视频编解码器和 Vorbis 音频编解码器

3、Ogg = Ogg 文件使用 Theora 视频编解码器和 Vorbis音频编解码器

扩展资料

想要实现HTML5技术的大量应用首先就需要将这些专利性的产品变为开放式的产品,以视频格式为例,两大阵营对于视频格式的设置存在争议,一大阵营以苹果为代表,另一大阵营则以Opera、火狐、谷歌为代表。

WPEG阵营是苹果所属阵营,由于其自身全部使用的是这一种格式,所以坚持认为应当将此格式作为标准,而WebM阵营则认为由于WPEG格式的专利依然没有解除,对于HTML5技术要求的开放性没有达标,所以不同意将其作为标准格式。

新建一个“audio.html”的html文件。

将音频文件放入“audio.html”文件同一目录下。

audio是html5新标签,所以我们填入html5的标准化代码,然后编写一个audio标签,引用同级目录下音频文件,并设置音频播放控件(必须填写)。

将“audio.html”文件用浏览器打开,我们就制作好了一个简单播放音频的播放器,点击播放按钮,就会播放出音频。

为了格式更加好看和解决有点浏览器不兼容audio问题,我们可以用source引用多个不同格式音频文件,同时在下方写入一段友情提示。

下面我们讲解下其他属性值对播放器的影响,autoplay属性为audio标签自动播放属性,当我们设置后,网页刷新后音频就会自动播放,效果如下图。

muted将音频设置为静音,默认情况为静音状态。

除了以上属性外,audio的loop属性设置音频的重复播放,preload属性设置音频是否被加载以及如何加载等等。