HTML | DOM 视频结束属性

HTML中的视频和音频标签都有一个常用的属性，即ended属性，用于判断媒体资源是否播放完毕。

HTML 中的 ended 属性

在HTML的<video>和<audio>标签中，ended属性返回一个布尔值，表示媒体资源是否已经播放完毕。可以使用 JavaScript 来获取该属性的值，示例如下：

<video src="example.mp4" controls id="myVideo"></video>
<script>
  const video = document.getElementById("myVideo");
  if(video.ended){
    console.log("视频已经播放完毕！");
  }else{
    console.log("视频还在播放！");
  }
</script>

DOM 中的 ended 属性

在 JavaScript 中，可以直接访问<video>和<audio>标签的ended属性来判断媒体资源是否已经播放完毕。例如：

const video = document.getElementById("myVideo");
if(video.ended){
  console.log("视频已经播放完毕！");
}else{
  console.log("视频还在播放！");
}

另外，<video>和<audio>标签也有一个ended事件，当媒体资源播放完毕时，会触发该事件。可以通过以下方式来监听该事件：

const video = document.getElementById("myVideo");
video.addEventListener("ended", function() {
  console.log("视频已经播放完毕！");
});

总结

ended属性是判断媒体资源是否已经播放完毕的常用属性，可以通过 HTML 标签和 DOM API 来获取和监听该属性。在实际开发中，可以使用该属性来对视频和音频的播放状态进行监控，以便做出相应的处理。