HTML5 API 之video/audio 视频/音频

港控/mmm° 2022-06-01 00:28 357阅读 0赞

video的使用方法：

你的浏览器不支持video标签

</video>

视频常用标签属性:

autoplay:自动播放

controls:视频操作控件

muted:静音

loop:循环播放

poster:加载完成前显示的图片

音频的使用方法

</audio>

音频常用标签属性:

autoplay:自动播放

controls:视频操作控件

muted:静音

loop:循环播放

视频/音频共同特性

<source> 标签允许您规定可替换的视频/音频文件供浏览器根据它对媒体类型或者编解码器的支持进行选择。

你的浏览器不支持video标签

可以在开始标签和结束标签之间放置文本内容，这样老的浏览器就可以显示出不支持该标签的信息。

#### HTML 音频/视频 方法 ####

#### HTML 音频/视频属性 ####

<table style="margin-right:0px; margin-bottom:10px; margin-left:0px; padding:0px; width:539px; color:rgb(62,62,62); font-family:&quot;Helvetica Neue&quot;,Helvetica,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif; font-size:16px; word-wrap:break-word!important">     
 <tbody style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> audioTracks</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示可用音频轨道的 AudioTrackList 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> autoplay</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回是否在加载完成后随即播放音频/视频。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> buffered</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示音频/视频已缓冲部分的 TimeRanges 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> controller</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示音频/视频当前媒体控制器的 MediaController 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> controls</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频是否显示控件（比如播放/暂停等）。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> crossOrigin</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频的 CORS 设置。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> currentSrc</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回当前音频/视频的 URL。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> currentTime</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频中的当前播放位置（以秒计）。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> defaultMuted</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频默认是否静音。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> defaultPlaybackRate</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频的默认播放速度。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> duration</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回当前音频/视频的长度（以秒计）。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> ended</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回音频/视频的播放是否已结束。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> error</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示音频/视频错误状态的 MediaError 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> loop</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频是否应在结束时重新播放。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> mediaGroup</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频所属的组合（用于连接多个音频/视频元素）。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> muted</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频是否静音。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> networkState</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回音频/视频的当前网络状态。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> paused</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频是否暂停。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> playbackRate</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频播放的速度。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> played</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示音频/视频已播放部分的 TimeRanges 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> preload</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频是否应该在页面加载后进行加载。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> readyState</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回音频/视频当前的就绪状态。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> seekable</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示音频/视频可寻址部分的 TimeRanges 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> seeking</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回用户是否正在音频/视频中进行查找。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> src</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频元素的当前来源。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> startDate</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示当前时间偏移的 Date 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> textTracks</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示可用文本轨道的 TextTrackList 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> videoTracks</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 返回表示可用视频轨道的 VideoTrackList 对象。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> volume</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 设置或返回音频/视频的音量。</td> 
  </tr> 
 </tbody> 
</table>

#### HTML 音频/视频事件 ####

<table style="margin-right:0px; margin-bottom:10px; margin-left:0px; padding:0px; width:539px; color:rgb(62,62,62); font-family:&quot;Helvetica Neue&quot;,Helvetica,&quot;Hiragino Sans GB&quot;,&quot;Microsoft YaHei&quot;,Arial,sans-serif; font-size:16px; word-wrap:break-word!important">     
 <tbody style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 事件</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 描述</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> abort</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音频/视频的加载已放弃时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> canplay</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器可以开始播放音频/视频时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> canplaythrough</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器可在不因缓冲而停顿的情况下进行播放时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> durationchange</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音频/视频的时长已更改时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> emptied</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当目前的播放列表为空时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> ended</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当目前的播放列表已结束时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> error</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当在音频/视频加载期间发生错误时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> loadeddata</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器已加载音频/视频的当前帧时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> loadedmetadata</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器已加载音频/视频的元数据时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> loadstart</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器开始查找音频/视频时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> pause</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音频/视频已暂停时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> play</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音频/视频已开始或不再暂停时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> playing</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音频/视频在因缓冲而暂停或停止后已就绪时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> progress</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器正在下载音频/视频时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> ratechange</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音频/视频的播放速度已更改时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> seeked</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当用户已移动/跳跃到音频/视频中的新位置时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> seeking</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当用户开始移动/跳跃到音频/视频中的新位置时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> stalled</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器尝试获取媒体数据，但数据不可用时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> suspend</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当浏览器刻意不获取媒体数据时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> timeupdate</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当目前的播放位置已更改时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; background-color:rgb(239,239,239); word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> volumechange</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当音量已更改时触发。</td> 
  </tr> 
  <tr style="margin:0px; padding:0px; max-width:100%; border:0px; font-size:15.36px; vertical-align:baseline; word-wrap:break-word!important"> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> waiting</td> 
   <td style="margin:0px; padding:2px 4px; border-color:rgb(204,204,204); max-width:100%; font-size:15.36px; vertical-align:top; min-width:40px; word-wrap:break-word!important"> 当视频由于需要缓冲下一帧而停止时触发。</td> 
  </tr> 
 </tbody> 
</table>