html5-音视频处理

html5 音视频标签使用

音视频处理

• video

  <video>
    <source src='foo.ogg' type='video/ogg' />
    <source src='foo.mp4' type='video/mp4' />
    浏览器不支持视频播放
  </video>
  <audio controls>
    <source src="3.mp3">
    <source src="3.wav">
    <source src="3.ogg">
    浏览器不支持音频播放
  </audio>

  属性：

  • width:宽度
  • height:高度
  • controls：播放控件
  • autoplay：视频加载完成后马上播放
  • loop：循环播放
  • muted：表示视频静音输出
  • poster：视频海报，用于在用户播放或跳帧之前展示，如果属性未指定，第一帧可用之前什么都不展示，之后第一帧就作为海报。
  • preload：预加载，
    • none 不加载
    • auto (默认)自动（尽快加载完毕）
    • metadata 只加载除视频之外的信息（宽高）

• audio
  操作 DOM 方法

  • play 开始播放
  • pause 暂停播放
  • error 媒体播放出错错误时触发
  • canPlayType(type)：查看浏览器是否支持这种文件格式的媒体文件。

操作 DOM 属性

• paused 是否处于暂停或者未播放状态
• ended 是否已经结束播放
• duration 返回媒体时长，秒为单位
• currentTime 获取或设置媒体播放位置