HTML5視頻循環播放代碼 HTML5視頻在網站和應用程序設計中越來越流行。視頻可以使內容更加生動和有吸引力。但是，如果您要播放的視頻需要不間斷地循環播放，您可能需要一些幫助來實現這一點。在本文中，我們將介紹如何使用HTML5代碼在網頁中循環播放視頻。 首先，讓我們創建一個基本的HTML5視頻播放器，如下所示：

<video id="myVideo" width="320" height="240">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

在這個基本的代碼中，我們創建了一個擁有ID為“myVideo”的視頻元素，并在其中嵌入了兩個源文件。這意味著如果一個文件不能被瀏覽器支持，瀏覽器將嘗試使用另一個文件來播放視頻。 現在，我們需要向代碼添加一個循環屬性，以便視頻可以不間斷地循環播放：

<video id="myVideo" width="320" height="240" loop>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

在這個新的代碼段中，我們添加了一個循環屬性，該屬性告訴瀏覽器在播放完一次視頻后立即重新開始播放。另外，如果您懶得在HTML中添加loop屬性，也可以使用JavaScript來實現循環播放。

<video id="myVideo" width="320" height="240">
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
<script>
var video = document.getElementById("myVideo");
video.addEventListener('ended', function() {
video.currentTime = 0;
video.play();
}, false);
</script>

在這個新的代碼段中，我們首先得到了video元素的引用。然后，我們添加了一個事件偵聽器，在視頻播放完成時自動將當前時間設置為0，重新開始播放。通過這種方法，我們可以輕松地實現視頻的循環播放。 結論 在本文中，我們介紹了如何在HTML5中循環播放視頻。我們學習了如何使用循環屬性以及如何使用JavaScript代碼來實現循環播放。如果您需要的是可以循環播放的視頻元素，請使用這些代碼段并改變它們以匹配您的需要！