Video标签

迷南。 2022-03-17 15:23 192阅读 0赞

##### 1、标签属性 #####

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td><strong>autoplay</strong></td> 
   <td>该属性使得视频在就绪后马上播放。</td> 
  </tr> 
  <tr> 
   <td><strong>controls</strong></td> 
   <td>该属性向用户显示控件，比如播放按钮。</td> 
  </tr> 
  <tr> 
   <td><strong>height</strong></td> 
   <td>设置视频播放器的高度。</td> 
  </tr> 
  <tr> 
   <td><strong>width</strong></td> 
   <td>设置视频播放器的宽度。</td> 
  </tr> 
  <tr> 
   <td><strong>loop</strong></td> 
   <td>当媒介文件完成播放后再次开始播放。</td> 
  </tr> 
  <tr> 
   <td><strong>preload</strong></td> 
   <td>视频在页面加载时进行加载，并预备播放。如果使用 “autoplay”，则忽略该属性。</td> 
  </tr> 
  <tr> 
   <td><strong>src</strong></td> 
   <td>要播放的视频的 URL。</td> 
  </tr> 
  <tr> 
   <td><strong>poster</strong></td> 
   <td>视频封面，没有播放时显示的图片。</td> 
  </tr> 
 </tbody> 
</table>

##### 2、媒介事件 #####

<table> 
 <thead> 
  <tr> 
   <th>属性</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td><strong>onabort</strong></td> 
   <td>当发生中止事件时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>oncanplay</strong></td> 
   <td>当媒介能够开始播放但可能因缓冲而需要停止时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>oncanplaythrough</strong></td> 
   <td>设当媒介能够无需因缓冲而停止即可播放至结尾时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>ondurationchange</strong></td> 
   <td>当媒介长度改变时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onemptied</strong></td> 
   <td>当媒介资源元素突然为空时（网络错误、加载错误等）运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onended</strong></td> 
   <td>当媒介已抵达结尾时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onerror</strong></td> 
   <td>当在元素加载期间发生错误时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onloadeddata</strong></td> 
   <td>当加载媒介数据时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onloadedmetadata</strong></td> 
   <td>当媒介元素的持续时间以及其他媒介数据已加载时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onloadstart</strong></td> 
   <td>当浏览器开始加载媒介数据时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onpause</strong></td> 
   <td>当媒介数据暂停时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>ondurationchange</strong></td> 
   <td>当媒介长度改变时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onplay</strong></td> 
   <td>当媒介数据将要开始播放时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onplaying</strong></td> 
   <td>当媒介数据已开始播放时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onprogress</strong></td> 
   <td>当浏览器正在取媒介数据时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onratechange</strong></td> 
   <td>当媒介数据的播放速率改变时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onreadystatechange</strong></td> 
   <td>当就绪状态（ready-state）改变时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onseeked</strong></td> 
   <td>当媒介元素的定位属性 不再为真且定位已结束时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onseeking</strong></td> 
   <td>当当媒介元素的定位属性为真且定位已开始时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onstalled</strong></td> 
   <td>当取回媒介数据过程中（延迟）存在错误时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onsuspend</strong></td> 
   <td>当浏览器已在取媒介数据但在取回整个媒介文件之前停止时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>ontimeupdate</strong></td> 
   <td>当媒介改变其播放位置时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onvolumechange</strong></td> 
   <td>当媒介改变音量亦或当音量被设置为静音时运行脚本。</td> 
  </tr> 
  <tr> 
   <td><strong>onwaiting</strong></td> 
   <td>当媒介已停止播放但打算继续播放时运行脚本。</td> 
  </tr> 
 </tbody> 
</table>

##### 3、方法 #####

<table> 
 <thead> 
  <tr> 
   <th>方法</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td><strong>addTextTrack()</strong></td> 
   <td>向音频/视频添加新的文本轨道。</td> 
  </tr> 
  <tr> 
   <td><strong>canPlayType()</strong></td> 
   <td>检测浏览器是否能播放指定的音频/视频类型。</td> 
  </tr> 
  <tr> 
   <td><strong>load()</strong></td> 
   <td>重新加载音频/视频元素。</td> 
  </tr> 
  <tr> 
   <td><strong>play()</strong></td> 
   <td>开始播放音频/视频。</td> 
  </tr> 
  <tr> 
   <td><strong>pause()</strong></td> 
   <td>暂停当前播放的音频/视频。</td> 
  </tr> 
 </tbody> 
</table>