html5 audio整理

1,128 阅读3分钟

新建audio对象

  1. <audio src='music.mp3'></audio>标签
  2. audio = new Audio('music.mp3')

属性

autoplay

是否加载完成后立刻播放

audio.autoplay = true | false(默认,加载后不立即播放)

buffered

audio.buffered

返回TimeRanges对象,表示用户的音频缓冲范围。

缓冲范围指的是已缓冲音频的时间范围。如果用户在音频中跳跃播放,会得到多个缓冲范围。

TimeRange: {
  length -获得音视频中已缓冲范围的数量
  start() - 获得某个已缓冲范围的开始位置
  end() -获得某个已缓冲范围的结束位置
}

controls

audio.controls = true | false(默认,不显示控件)

设置或返回浏览器应当显示标准的音视频控件。

注:需要先创建audio标签。

currentSrc

audio.currentSrc

返回当前音频的 URL

currentTime

audio.currentTime = Number(以秒记的数字)

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

duration

audio.duration

返回当前音频的长度,以秒计。如果未设置音频,则返回 NaN。

ended

audio.ended

返回音频是否结束。

loop

audio.loop = true | false(默认,不循环)

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

muted

audio.muted = true | false(默认,表示打开声音)

设置或返回音频是否应该被静音(关闭声音)。

networkState

audio.networkState

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

返回值:

  • 0 = NETWORK_EMPTY - 音频尚未初始化
  • 1 = NETWORK_IDLE - 音频是活动的且已选取资源,但并未使用网络
  • 2 = NETWORK_LOADING - 浏览器正在下载数据
  • 3 = NETWORK_NO_SOURCE - 未找到音频来源

paused

audio.paused

返回音频是否已暂停。

readyState

audio.readyState

返回音频的当前就绪状态。就绪状态指示音频是否已准备好播放。

返回值:

  • 0 = HAVE_NOTHING - 没有关于音频/视频是否就绪的信息
  • 1 = HAVE_METADATA - 关于音频/视频就绪的元数据
  • 2 = HAVE_CURRENT_DATA - 关于当前播放位置的数据是可用的,但没有足够的数据来播放下一帧/毫秒
  • 3 = HAVE_FUTURE_DATA - 当前及至少下一帧的数据是可用的
  • 4 = HAVE_ENOUGH_DATA - 可用数据足以开始播放

src

audio.src = URL

设置或返回音频的当前来源。

volume

audio.volume = volumevalue(介于0-1之间的数字)

设置或返回音频的当前音量。

方法

canPlayType()

audio.canPlayType(type)

检测浏览器是否能播放指定的音频类型。

返回值:

  • "probably" - 最有可能支持
  • "maybe" - 可能支持
  • "" - (空字符串)不支持

play()

audio.play()

开始播放当前的音频。

pause()

audio.pause()

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

事件

当音频处于加载过程中时,会依次发生以下事件:

  • loadstart当浏览器开始查找音频时
  • durationchange当音频的时长已更改时
  • loadedmetadata当浏览器已加载音频的元数据时
  • loadeddata当浏览器已加载音频的当前帧时
  • progress当浏览器正在下载音频时
  • canplay当浏览器可以播放音频时
  • canplaythrough当浏览器可在不因缓冲而停顿的情况下进行播放时

其它事件:

  • abort当音频的加载已放弃时
  • emptied当目前的播放列表为空时
  • ended当目前的播放列表已结束时
  • error当在音频加载期间发生错误时
  • ause当音频已暂停时
  • play当音频已开始或不再暂停时
  • playing当音频在已因缓冲而暂停或停止后已就绪时
  • ratechange当音频的播放速度已更改时
  • seeked当用户已移动/跳跃到音频中的新位置时
  • seeking当用户开始移动/跳跃到音频中的新位置时
  • stalled当浏览器尝试获取媒体数据,但数据不可用时
  • suspend当浏览器刻意不获取媒体数据时
  • timeupdate当目前的播放位置已更改时
  • volumechange当音量已更改时
  • waiting当视频由于需要缓冲下一帧而停止