<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<audio src="img/gaobaiqiqiu.mp3" controls="controls" ></audio>
<!--<video width="800" src="img/shiping.mp4" controls="controls"></video>-->
<!--<video src="img/shiping.mp4" controls="controls" width="600" height="" autoplay="autoplay" >
-->
<!--</video>
-->-->
<button class='fuge'>副歌</button>
<button class="play">播放/暂停</button>
<button class="muted">静音/不静音</button>
<button class="sound">声音</button>
<script type="text/javascript">
var a1 = document.querySelector('audio')
//保证用户体验，要跟用户交互才能调用此功能
a1.autoplay = true;
// a1.muted = true;
document.querySelector('.play').onclick = function(){
if(a1.paused){
a1.play()
}else{
a1.pause()
}
}
document.querySelector('.fuge').onclick = function(){
a1.currentTime = 70
a1.play()
}
document.querySelector('.muted').onclick = function(){
// a1.muted = true
if(a1.muted){
a1.muted = false
}else{
a1.muted = true
}
}
document.querySelector('.sound').onclick = function(){
if(a1.volume > 0.8){
a1.volume = 0.5
}else{
a1.volume = 0.2
}
}
</script>
</body>
</html>
