html5的音视频标签的很多方法、属性，api接口都是用javascript控制的。所以想灵活的使用这些功能就应该先学会使用javascript 。
下面是本节课的实例代码，供大家学习分享。
<!doctype html>
<html>
<head>
<title>html5的音频视频标签测试</title>
</head>
<body>
<video controls poster="PLMM.jpg" id="shipin">
<source src="movie.webm" type="video/webm" >
您的浏览器暂时不支持video标签播放视频
</video>
<br />
<button onclick="bofang()">播放</button>
<button onClick="zanting()">暂停</button>
<button onClick="kuaijin()">快进10秒</button>
<button onClick="kuaitui()">快退10秒</button>
<button onClick="jingyin(this)">闭嘴</button>
<button onclick="soso()">加速播放</button>
<button onclick="yu()">减速播放</button>
<button onclick="normal()">正常播放</button>
<button onclick="upper()">提高嗓门</button>
<button onclick="lower()">降低嗓门</button>
<script>
var video=document.getElementById('shipin');
//播放
function bofang(){
video.play();
}
//暂停
function zanting(){
video.pause();
}
//快进
function kuaijin(){
video.currentTime+=10;
}
//快退
function kuaitui(){
video.currentTime-=10;
}
//静音和非静音
function jingyin(obj){
if(video.muted){
video.muted=false;
obj.innerHTML="闭嘴";
}else{
video.muted=true;
obj.innerHTML="张嘴";
}
}
//加速播放(3倍速度)
function soso(){
video.playbackRate=3;
}
//慢速播放(慢三倍)
function yu(){
video.playbackRate=1/3;
}
//正常倍速
function normal(){
video.playbackRate=1;//默认的播放倍速是1
}
//调高声音
function upper(){
video.volume+=0.2;//声音值的范围是0-1
}
//调低声音
function lower(){
video.volume-=0.2;
}
</script>
<hr />
音频标签的使用<br />
<audio src="我的好兄弟.mp3" controls>
您的老牛已经拉不动破车了，赶紧换了吧，想听中国好声音么？
</audio>
</body>
</html>
淘宝店
