最直接的播放状态判断是读取 paused 属性：false 表示正在播放（含缓冲中），true 表示暂停或未开始；但需结合 playing/pause 事件、readyState、networkState 及 error 综合判断真实状态。
用 paused 属性判断视频是否在播放
HTML5 元素最直接的播放状态判断方式是读取 paused 属性：它为 false 表示正在播放（包括缓冲中但未暂停），true 表示已暂停或尚未开始播放。
注意：这个属性不区分“正在解码”“卡在首帧”或“网络卡顿”，只反映用户交互或脚本调用导致的暂停状态。比如调用 play() 后立刻读取，可能仍为 true（因异步加载未就绪）。
- 推荐在
play和pause事件回调里读取，确保状态准确 - 不要依赖单次读取结果做关键逻辑，尤其在自动播放场景下
-
paused是只读属性，设为false不会触发播放
监听 playing 和 pause 事件来捕获状态变化
仅靠轮询 paused 容易漏掉瞬时状态切换。更健壮的做法是监听原生事件：playing 触发表示视频已真正开始呈现帧（跳过加载/解码等待），pause 触发表示用户或脚本主动暂停。
这两个事件比 play（只是发起播放请求）和 ended（仅结尾）更能反映真实播放意图。
立即学习“前端免费学习笔记（深入）”；
const video = document.querySelector('video');
video.addEventListener('playing', () => {
console.log('视频已开始播放（有画面输出）');
});
video.addEventListener('pause', () => {
console.log('视频已暂停');
});
结合 readyState 和 networkState 排查“假播放”
有时候 paused === false 但画面卡住不动，实际是网络中断或解码失败。这时要查 readyState（内容可播放程度）和 networkState（网络连接状态）：
-
readyState === 0：尚未初始化（HAVE_NOTHING） readyState ：还没到“至少有一帧可播放”（HAVE_FUTURE_DATA）-
networkState === 0：网络断开（NETWORK_EMPTY） -
networkState === 3：网络出错（NETWORK_NO_SOURCE）
如果 paused === false 但 readyState ，说明视频名义上在播，实际没数据可渲染——这时候该显示 loading 或报错，而不是认为“一切正常”。
移动端自动播放限制下的特殊处理
iOS Safari 和 Android Chrome 对自动播放加了严格限制：没有用户手势触发的 play() 调用会静默失败，并抛出 NotAllowedError。此时 paused 仍为 true，但后续所有状态事件都不会触发。
必须用 try/catch 捕获错误，并降级处理：
video.play().catch(err => {
if (err.name === 'NotAllowedError') {
console.log('自动播放被阻止，请用户点击后重试');
// 显示播放按钮、提示文案等
}
});
别忘了检查 video.error 是否为非空对象，它可能包含更具体的失败原因（如 MediaError.MEDIA_ERR_SRC_NOT_SUPPORTED）。
真正难的不是写判断代码，而是理解浏览器什么时候“嘴上说在播，其实一帧都没画出来”。状态组合（paused + readyState + error + 事件流）缺一不可。
