HTML DOM Video 对象

HTML 中的 <video> 对象用于在网页中嵌入视频内容。通过 <video> 标签，我们可以方便地在网页中展示视频，并控制视频的播放、暂停、音量等属性。

属性

src

src 属性用于指定视频文件的 URL 地址。例如：

<video src="movie.mp4"></video>

controls

controls 属性用于显示视频播放控制条，包括播放/暂停按钮、音量控制、全屏等功能。例如：

<video src="movie.mp4" controls></video>

width 和 height

width 和 height 属性用于指定视频的宽度和高度，单位为像素。例如：

<video src="movie.mp4" width="480" height="270"></video>

autoplay

autoplay 属性用于指定视频自动播放。例如：

<video src="movie.mp4" autoplay></video>

loop

loop 属性用于指定视频循环播放。例如：

<video src="movie.mp4" loop></video>

方法

play()

play() 方法用于开始播放视频。例如：

<video id="myVideo" src="movie.mp4"></video>

<script>
  var video = document.getElementById("myVideo");
  video.play();
</script>

pause()

pause() 方法用于暂停视频播放。例如：

<video id="myVideo" src="movie.mp4"></video>

<script>
  var video = document.getElementById("myVideo");
  video.pause();
</script>

load()

load() 方法用于重新加载视频。例如：

<video id="myVideo" src="movie.mp4"></video>

<script>
  var video = document.getElementById("myVideo");
  video.load();
</script>

事件

onplay

onplay 事件在视频开始播放时触发。例如：

<video id="myVideo" src="movie.mp4" onplay="console.log('Video is playing')"></video>

onpause

onpause 事件在视频暂停播放时触发。例如：

<video id="myVideo" src="movie.mp4" onpause="console.log('Video is paused')"></video>

onended

onended 事件在视频播放结束时触发。例如：

<video id="myVideo" src="movie.mp4" onended="console.log('Video has ended')"></video>

以上就是关于 HTML 对象 <video> 的详细介绍，希望能帮助你更好地理解和使用视频在网页中的应用。