loop属性仅对和有效，其他元素如、、上无效；它为布尔开关，无次数控制，不触发JS事件，且与onended不冲突但行为易混淆。

HTML 的 loop 属性只对 <audio></audio> 和 <video></video> 有效，不能用于图片、Canvas 或其他元素；它只是个布尔开关，没有次数控制，也不触发 JS 事件。

哪些标签能用 loop？哪些根本没用

只有原生媒体元素支持：<audio></audio> 和 <video></video>。加在 <img>、<iframe></iframe>、<canvas></canvas> 上完全被浏览器忽略——连控制台警告都不会有。

• <audio src="a.mp3" loop></audio> ✅ 自动从头重播
• <video src="v.mp4" loop muted></video> ✅ 必须加 muted 才能在多数浏览器自动播放（含循环）
• <img src="x.gif" loop> ❌ GIF 本身带循环逻辑，loop 属性无效
• <video loop></video> 但没设 src 或资源加载失败 → 循环不生效，也没报错

loop 和 JavaScript 的 onended 冲突吗

不冲突，但行为容易混淆：如果同时写了 loop 属性和监听 onended，事件仍会触发（哪怕视频立刻重播了）。这是很多人以为“循环没起作用”的原因——其实它起了，只是你监听到结束瞬间而已。

html-to-pptx-converter

使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。

下载

• 想靠 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 方案，别硬扛属性。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！