java 前端播放视频以及视频获取播放进度

<div class="shiping">
    <video id="video" class="video-js vjs-big-play-centered" controls="controls" poster="">
        <source src="/paper/questions/getVideo" type='video/mp4'>
    </video>
</div>

<script>
    let elevideo = document.getElementById('video');
    elevideo.addEventListener('loadedmetadata', () => {
        //视频的总长度
        console.log('总长度:' + elevideo.duration);
        clearInterval(this.timer);
    });
    elevideo.addEventListener('play', () => {
        //播放开始执行的函数
        console.log('开始播放');
    });
    elevideo.addEventListener('playing', () => {
        //播放中
        console.log('播放中');
        this.timer = setInterval(() => {
            console.log('播放进度:' + parseFloat(elevideo.currentTime));
        }, 100);
    });
    elevideo.addEventListener(
        'ended',
        () => {
            //结束
            console.log('播放结束');
            clearInterval(this.timer);
        },
        false
    );
</script>