SOURCE

	window.onload=function(){
			var oStart = document.getElementById('start');
			var oEnd = document.getElementById('end');
			var oPause = document.getElementById('pause');
			var oSpeed = document.getElementById('speed');
			var oVideo = document.getElementById('videoSource');
			// 开始函数
			oStart.onclick=function(){
				oVideo.play();
			}
			// 暂停函数
			oPause.onclick=function(){
				oVideo.pause();
			}
			// 停止函数
			oEnd.onclick=function(){
				oVideo.pause();
				oVideo.currentTime=0;
			}
			// 加速函数
			oSpeed.onclick=function(){
				oVideo.play();oVideo.playbackRate = 4;//注意这里速度大于4的时候，就没有声音了，声音得不到同步
			}
			// 这个事件是在视频播放中一直执行的事件
			oVideo.ontimeupdate=function(){
				var oPositionBar = document.getElementById('positionBar');
				oPositionBar.value= (oVideo.currentTime/oVideo.duration*100);
			}
		}

	<div>
		<video id="videoSource" width="500px">
			<source src="https://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4">
		</video>
		<div id="durationbar">
			<progress id="positionBar" value="0" max="100"></progress>
		</div>
	</div>
	<button id="start">开始</button>
	<button id="end">停止</button>
	<button id="pause">暂停</button>
	<button id="speed">2倍速度</button>

#durationbar{
		width: 500px;
		height: 20px;
	}
	#durationbar progress{
		width: 100%;
		height: 100%;
	}