HTML切換視頻

HTML中可以通過(guò)JavaScript實(shí)現(xiàn)視頻的切換。下面是一個(gè)簡(jiǎn)單的代碼示例：

<video id="myVideo" controls><source src="video1.mp4" type="video/mp4"><source src="video1.ogg" type="video/ogg"></video><script>let video = document.getElementById("myVideo");
let videoSources = [
"video1.mp4",
"video1.ogg",
"video2.mp4",
"video2.ogg",
];
let currentSource = 0;
function switchVideo() {
currentSource++;
if (currentSource >= videoSources.length) {
currentSource = 0;
}
video.src = videoSources[currentSource];
video.play();
}
setInterval(() =>{
switchVideo();
}, 5000);
</script>

在上面的代碼中，創(chuàng)建了一個(gè)視頻元素（id為“myVideo”），其中包含兩個(gè)不同格式的視頻源文件。用一個(gè)數(shù)組存儲(chǔ)了需要切換的視頻源文件列表（videoSources），currentSource表示當(dāng)前要播放的視頻源，初始值為0。在switchVideo函數(shù)中，將currentSource加1，如果currentSource超過(guò)了列表長(zhǎng)度，則回到第一個(gè)視頻。然后將視頻元素的src屬性設(shè)置為當(dāng)前視頻源文件并調(diào)用play方法播放視頻。最后，在頁(yè)面加載后，定時(shí)器將每5秒執(zhí)行一次switchVideo函數(shù)，切換視頻。