play() 方法无结束回调，其 Promise 在播放开始时解决而非结束；监听 ended 事件才是标准做法，需在 loadedmetadata 或 canplay 后绑定，避免漏触发。
HTML5 play() 方法本身没有结束回调
别被函数名误导了——play() 只是启动播放，它返回一个 Promise，但这个 Promise 解决（resolve）的时机是「播放成功开始」，不是「播完了」。想监听播放结束，得靠 ended 事件。
监听 ended 事件才是标准做法
所有现代浏览器都支持对 或 元素绑定 ended 事件，它在媒体自然播放到末尾时触发。
实操建议：
- 确保元素已加载元数据（
loadedmetadata或至少canplay后再监听，避免漏触发） - 用
addEventListener('ended', handler)，不要用onended，便于后续移除 - 如果元素可能被复用（比如循环播放、切换资源），记得在新
src设置前先removeEventListener
简单示例：
立即学习“前端免费学习笔记（深入）”；
const video = document.querySelector('video');
video.addEventListener('ended', () => {
console.log('播放结束了');
// 这里写你的回调逻辑，比如跳转、提示、自动重播等
});
为什么不用 timeupdate + duration 判断？
有人试图轮询当前时间是否接近 duration，这既不精确也不必要：
-
video.duration在未加载完成时可能是NaN或Inf -
timeupdate触发频率不稳定，容易错过临界点 - 快进、网络缓冲、音视频不同步等情况会让时间比对失效
-
ended是浏览器原生事件，准确、轻量、语义明确
注意自动播放策略对 ended 的影响
如果视频是静音且自动播放（muted autoplay），ended 仍会正常触发；但如果因策略被阻止（比如有声音且无用户交互），play() 会抛错，ended 自然也不会来——所以务必检查 play() 的 Promise 是否 reject，并处理失败路径。
容易被忽略的一点：某些安卓 WebView 或旧版 iOS 中，ended 在全屏退出后可能延迟触发，或在资源释放过程中丢失。如需强保障，可结合 pause + currentTime === duration 做兜底判断，但仅限特定场景。
