html中的audio

audio支持wav、mp3、ogg、acc、webm等格式,每个浏览器因为版权问题支持的格式都不一样

浏览器对audio的支持情况

音频格式 Chrome Firefox IE9 Opera Safari
OGG 支持 支持 支持 不支持 不支持
MP3 支持 不支持 支持 不支持 支持
WAV 不支持 支持 不支持 支持 不支持

没有一种通用的文件格式让每个浏览器都使用单个文件格式意味着至少有 2/5 的浏览器无法播放某些声音。这不是无法在单一音频标准中达成一致的浏览器制造商不妥协的问题,而是涉及专利权和特许权使用费的法律和财务问题。不受软件专利限制的 OGG 格式旨在一劳永逸地解决这个问题。然而,在撰写本文时,Opera 和 Safari 都不支持 OGG。与 OGG 格式的文件相比,可用的 WAV 和 MP3 文件数量要更多,因此毫无疑问,浏览器制造商考虑到了这一点。MP3 作为事实的标准是个很好的解决方案。

解决方案

HTML5 提供了一个解决方案,使您喜欢的浏览器能够找到一种兼容的格式。

<audio controls>
    <source src=”http://demo.mimvp.com/html5/take_you_fly.ogg” />
    <source src=”http://demo.mimvp.com/html5/take_you_fly.mp3″ />
    <source src=”http://demo.mimvp.com/html5/take_you_fly.wav” />
audio>

audio的属性

属性 描述
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 设置或返回音频的音量。

audio的方法

方法 描述
addTextTrack() 向音频添加新的文本轨道。
canPlayType() 检查浏览器是否能够播放指定的音频类型。
fastSeek() 在音频播放器中指定播放时间。
getStartDate() 返回新的 Date 对象,表示当前时间线偏移量。
load() 重新加载音频元素。
play() 开始播放音频。
pause() 暂停当前播放的音频。

audio的监听事件

事件 描述
loadstart 当浏览器开始寻找指定的音频/视频时,会发生 loadstart 事件。即当加载过程开始时
durationchange 当指定音频/视频的时长数据发生变化时,发生 durationchange 事件。
loadedmetadata 当指定的音频/视频的元数据已加载时,会发生 loadedmetadata 事件。
progress 当浏览器正在下载指定的音频/视频时,会发生 progress 事件。
suspend 该事件在媒体数据被阻止加载时触发。可以是完成加载后触发,或者因为被暂停的原因。
loadeddata 当当前帧的数据已加载,但没有足够的数据来播放指定音频/视频的下一帧时,会发生 loadeddata 事件
canplay 当浏览器能够开始播放指定的音频/视频时,发生 canplay 事件。
canplaythrough 当浏览器预计能够在不停下来进行缓冲的情况下持续播放指定的音频/视频时,会发生 canplaythrough 事件。
play 开始播放时触发
playing 开始回放
timeupdate 播放时间改变 这个会一直打印
pause 暂停时会触发,当播放完一首歌曲时也会触发
ended 当播放完一首歌曲时也会触发
abort 客户端主动终止下载(不是因为错误引起)
error 请求数据时遇到错误
stalled 网速失速
waiting 等待数据,并非错误
seeking 寻找中
seeked 寻找完毕
ratechange 播放速率改变
volumechange 音量改变
// 例
audio.addEventListener("timeupdate", function () { // 播放时间改变   这个会一直打印
    console.log("event timeupdate: ", audio.currentTime);
});

你可能感兴趣的:(javascript)