loop属性仅对和有效，其他元素如、、上无效；它为布尔开关，无次数控制，不触发JS事件，且与onended不冲突但行为易混淆。
HTML 的 loop 属性只对 <audio></audio> 和 <video></video> 有效，不能用于图片、Canvas 或其他元素；它只是个布尔开关，没有次数控制，也不触发 JS 事件。
哪些标签能用 loop？哪些根本没用
只有原生媒体元素支持：<audio></audio> 和 <video></video>。加在 <img alt="HTML怎么循环播放媒体_HTML loop属性适用场景【方法】" >、<iframe></iframe>、<canvas></canvas> 上完全被浏览器忽略——连控制台警告都不会有。
-
<audio src="a.mp3" loop></audio>✅ 自动从头重播 -
<video src="v.mp4" loop muted></video>✅ 必须加muted才能在多数浏览器自动播放（含循环） -
<img src="x.gif" loop alt="HTML怎么循环播放媒体_HTML loop属性适用场景【方法】" >❌ GIF 本身带循环逻辑，loop属性无效 -
<video loop></video>但没设src或资源加载失败 → 循环不生效，也没报错
loop 和 JavaScript 的 onended 冲突吗
不冲突，但行为容易混淆：如果同时写了 loop 属性和监听 onended，事件仍会触发（哪怕视频立刻重播了）。这是很多人以为“循环没起作用”的原因——其实它起了，只是你监听到结束瞬间而已。
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
- 想靠
onended做自定义重播逻辑？先移除loop属性，否则行为不可控 -
loop是声明式、无副作用的；onended是命令式、可编程的——两者定位不同，别混着用 - Chrome 120+ 对自动循环视频加了更严格的静音要求，
muted缺失时可能直接卡在第一帧
移动端 iOS Safari 的 loop 特别坑在哪
iOS Safari 对 loop 的支持是“半残”状态：它允许循环，但禁止自动播放（包括循环启动），除非用户有明确交互（比如点击按钮）。而且，如果视频带音频且未 muted，loop 直接失效。
立即学习“前端免费学习笔记（深入）”；
- 必须用用户手势触发
play()，才能激活loop行为 -
<video autoplay loop></video>在 iOS 上等同于没写autoplay和loop - 绕过方案：用
play().catch(e => console.warn("iOS blocked", e))捕获拒绝，再提示用户点一下
真正麻烦的不是怎么写 loop，而是它不提供任何钩子告诉你“现在第几次循环了”，也没法暂停某次循环中间。需要计数或分段控制，只能切到 JS 方案，别硬扛属性。
