改变video的src

直接改变video的source是不能播放视频的

    <!-- 第一种 -->
	<video id="video_play">
		<source src="" type="" id="video1">
	</video>
	<button id="click1">点击1</button>
	<!-- 第二种 -->
	<video id="video_play1">
		<!-- <source src="" type="" id="video2"> -->
	</video>
	<button id="click2">点击2</button>
	<!-- 第三种 -->
	<video id="video_play3">
	</video>
	<button id="click3">点击3</button>

    document.getElementById("click1").onclick = function(){
		document.getElementById("video1").src = "//r.babytree.com/hL5m2BK";
		document.getElementById("video_play").play();
		// 此时视频是不能播放的
	}
	document.getElementById("click2").onclick = function(){
		document.getElementById("video_play1").src = "//r.babytree.com/hL5m2BK";
		document.getElementById("video_play1").play();
		// 这样视频是可以播放的
	}
    var newDom = document.createElement("source");
	document.getElementById("click3").onclick = function(){
		newDom.setAttribute("src","//r.babytree.com/hL5m2BK");
		document.getElementById("video_play3").appendChild(newDom);
		document.getElementById("video_play3").play();
		// 这样视频是可以播放的
	}

因此，可以推断出来的是，当 video 中存在 source 标签的时候，浏览器渲染之后会自动去获取地址，即便地址改变，浏览器也不会再去获取地址。但是通过动态的插入 source 标签的方式，可以触发浏览器进行重排，从而去获取相应地址的文件进行播放。