音乐播放器的控制

HTML:

    <!-- 选择音乐并用浏览器自带的音乐播放器进行播放 -->
    <video src="img/广东爱情故事.mp3" id="mv" loop controls>不支持此属性</video>
    <br>
    <!-- 按钮控制音乐的播放与暂停，后面显示播放的进度和总时长 -->
    <input type="button" id="bn" value="播放"><span id="detail"></span>秒

JS:

       var bn = document.getElementById("bn"); //获得按钮对象
        var mv = document.getElementById("mv"); //获得音乐对象
        var detail = document.getElementById("detail"); //获得显示时长的标签
        //video元素的ontimeupdate事件绑定监听器
        mv.ontimeupdate = function() {
            detail.innerHTML = mv.currentTime + "/" + mv.duration; //进行时长的添加
        }
        bn.onclick = function() {
            if (mv.paused) {
                mv.play();
                bn.value = "暂停"
            } else {
                mv.pause();
                bn.value = "播放"
            }
        }