<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>视频切换</title>
<style>
.视频框{
width: 500px;
height: 350px;
}
</style>
</head>
<body>
<video id="video" width="100%" height="100%" autoplay loop controls class="视频框">
<source id="source" src="https://media.w3.org/2010/05/sintel/trailer.mp4">
</video>
<button id="but1">第一个</button>
<button id="but2">第二个</button>
<button id="but3">第三个</button>
<script type="text/javascript">
document.getElementById("but1").onclick = function() {
document.getElementById("source").src = "./video/1.mp4";
document.getElementById("video").load();
}
document.getElementById("but2").onclick = function() {
document.getElementById("source").src = "https://media.w3.org/2010/05/sintel/trailer.mp4";
document.getElementById("video").load();
}
document.getElementById("but3").onclick = function() {
document.getElementById("source").src = "./video/2.mp4";
document.getElementById("video").load();
}
</script>
</body>
</html>
09-04
4073
![](https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png)
06-02