📌  相关文章
📜  HTML | DOM 视频循环属性(1)

📅  最后修改于: 2023-12-03 15:15:37.245000             🧑  作者: Mango

HTML | DOM 视频循环属性

在 HTML 中，你可以通过视频循环属性来控制视频的播放次数。在播放结束后视频可以循环播放多次，也可以只播放一次。

什么是视频循环属性

视频循环属性是一种 HTML 属性，它允许视频播放器在播放结束后，自动重新开始播放。视频循环属性不是一个必填属性，因为大多数情况下视频都可以自动循环播放。

语法

视频循环属性的语法如下：

<video loop>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>
属性值
  • loop: 视频结束后重新播放。
代码示例

下面是一段代码示例，让视频循环播放两次。

<!DOCTYPE html>
<html>
<body>

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

</body>
</html>
DOM

你还可以使用 JavaScript 添加视频循环属性。下面的代码片段演示了如何使用 DOM 来控制视频循环播放。

// 获取视频元素
var video = document.getElementById("myVideo");

// 重新开始播放两次
video.loop = true;
video.play();
结论

在 HTML 中，视频循环属性是非常实用的。它可让你控制视频播放循环的次数，这样你可以在页面上反复播放视频，或者将其循环播放多次。如果你想让你的站点变得更具吸引力，就尝试使用视频循环属性吧！