loop属性仅对video和audio有效，必须作为布尔属性使用（如或video.loop=true），且需配合muted才能在现代浏览器中正常循环；ios safari还需playsinline并依赖用户手势触发play()。
loop 属性只对 <video></video> 和 <audio></audio> 有效，写错位置、漏 muted、或指望它在 <img> 上起作用，就完全不会循环。
loop 属性必须写成布尔属性，不能带值
浏览器只检测该属性是否存在，不解析它的值。以下写法全部无效：
<video loop="true"></video><video loop="1"></video>-
<video loop=""></video>（空字符串在部分旧环境可能被忽略）
正确写法只有两种：
- 静态 HTML：
<video src="v.mp4" loop></video> - JS 动态控制：
video.loop = true（注意是布尔值true，不是字符串"true"）
用 setAttribute('loop', 'true') 也无效——它只是加了个无意义的字符串属性，不会触发循环逻辑。
不加 muted，loop 很可能根本没机会启动
现代浏览器（Chrome 120+、Edge、Safari macOS/iOS）普遍阻止未静音的自动播放。而 loop 的重播行为依赖视频“已开始播放”这个前提。如果 autoplay 因有声被拦截，视频卡在第一帧，loop 就永远不会触发。
- 背景视频等静音场景：必须组合
autoplay muted loop - iOS Safari 还额外要求
playsinline，否则强制全屏，破坏布局 - 想后续开声音？得等用户手势（如点击）后，再执行
video.muted = false; video.play()
检查是否加载成功，可打印 video.readyState：≥ 4 表示已就绪；为 0 表示未加载或被拦截。
监听 ended 事件和 loop 并不冲突，但行为容易误判
即使写了 loop，ended 事件仍会触发——它反映的是“本次播放结束”的瞬间，不是“循环被禁用”。很多人因此以为 loop 失效了，其实只是没意识到事件和重播是并行发生的。
- 想做循环计数？
loop不提供钩子，只能切到ended+ 手动currentTime = 0 - 想中途暂停某次循环？
loop不支持，必须用 JS 控制pause()和play() - 同时用了
loop和ended重播逻辑？行为不可控，建议二选一：声明式用loop，命令式就移除它
手动重播要小心 Promise 拒绝：调用 play() 时若未满足静音/手势条件，会抛出错误，需 .catch(e => console.warn(e)) 捕获。
iOS Safari 的 loop 是“半生效”状态
它允许循环，但不保证自动启动。哪怕写了 autoplay loop muted，首次播放仍需用户点击触发 play()，否则整个流程卡住。
-
<video autoplay loop muted></video>在 iOS 上 ≈ 没写autoplay和loop - 必须用用户手势显式调用
video.play().catch(...)才能激活循环链路 - 视频含音频且未
muted？loop直接被忽略，连尝试都不会有
真正麻烦的不是怎么写 loop，而是它不暴露循环次数、不支持中断某次、也不反馈重播时机——这些都得靠 JS 补足，别硬扛属性本身。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
