1、操纵
标签

基本语法

视频标签对像.属性名 = 值;
视频标签对像.方法名();

功能

视频标签对像.play() 开始播放视频。
视频标签对像.pause() 暂停当前播放的视频。
视频标签对像.currentTime 设置或返回视频中的当前播放位置（以秒计）。
视频标签对像.muted 设置或返回是否关闭声音。

代码

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>复仇者联盟</title>
  5. <meta charset="utf-8" />
  6.   <script type="text/javascript">
  7.       var video = document.getElementById("vo");
  8.       function hello1(){
  9.           video.play();
  10.       }
  11.       function hello2(){
  12.           video.pause();
  13.       }
  14.       function hello3(){
  15.           video.currentTime = 78;
  16.       }
  17.       function hello4(){
  18.           video.muted = !video.muted;
  19.       }
  20.     </script> 
  21. </head>
  22. <body style="text-align:center;">
  23. <video id="vo" width="700" controls src="http://www.yyfun001.com/res/htmlclassics/full/video/avenger.mp4"></video>
  24.     <br/><br/>
  25. <input type="button" value="播放" onclick="hello1()" />
  26. <input type="button" value="暂停" onclick="hello2()" />
  27. <input type="button" value="设置进度" onclick="hello3()" />
  28. <input type="button" value="静音" onclick="hello4()" />
  31. </body>
  32. </html>

操纵视频 - 图1

代码讲解

1、播放视频

function hello1(){
video.play();
}
video.play(); 视频播放

2、播放暂停

function hello2(){
video.pause();
}
video.pause(); 视频暂停

3、设计播放时间

function hello3(){
video.currentTime = 78;
}
video.currentTime = 78; 设置播放时间从78秒开始

4、播放视频

function hello4(){
video.muted = !video.muted;
}
video.muted = !video.muted; 视频声音开启或关闭