fallback内容必须写在标签内部且为合法html(如、),不能含或等可执行元素;不参与fallback,仅作用于成功加载的插件;现代浏览器中已基本退化,pdf推荐用或pdf.js,svg用或内联,音视频用/。

object 标签加载失败时的 fallback 内容怎么写才有效
直接把降级内容写在 <object></object> 开始和结束标签之间,浏览器会自动识别——但前提是内容不能被提前解析或执行。常见错误是把 <script></script> 或 <iframe> 直接塞进去,结果 fallback 本身又出错或阻塞渲染。</iframe>
- fallback 区域只应包含纯 HTML 内容(如文本、
<img>、<a></a>),避免嵌套可执行资源 - 如果需要 JS 逻辑兜底(比如检测插件缺失后跳转),必须用
onerror事件 +document.write或 DOM 操作动态注入,不能写死在标签体内 - Chrome 和 Firefox 对
<object data="xxx"></object>的 fallback 触发时机不一致:前者在data404 或 MIME 不匹配时触发,后者还可能在插件未启用时就展示 fallback
为什么 传参在 fallback 下完全失效
<param> 只作用于 <object></object> 成功加载的插件实例,一旦降级发生,整个 object 上下文销毁,<param> 标签被忽略。你看到的“参数没传过去”,其实是 fallback 根本没收到任何参数上下文。
- 所有依赖参数的逻辑(比如 Flash 的
flashvars或 PDF 的page)必须在 fallback 内部重新实现,例如用 URL 查询参数构造<iframe src="pdf.js?file=xxx.pdf#page=3"></iframe> - 不要试图用
document.querySelector('object').getAttribute('data')在 fallback 里读取原始data值——object 元素此时已处于 error 状态,DOM 属性可能为空或不可靠 - 若需复用原始配置,建议提前用 JS 提取并存入变量,再由 fallback 逻辑读取
用
不能。<embed></embed> 是 void 元素,没有结束标签,也不支持 fallback 内容;它连 onerror 都不触发,失败时静默白屏或显示浏览器默认占位符。现在主流方案是彻底放弃 <object></object>/<embed></embed>,改用现代替代方案。
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
- PDF:优先用
<iframe src="xxx.pdf"></iframe>(配合服务端返回Content-Type: application/pdf)或 pdf.js 库 - SVG:内联
<svg></svg>或<img src="xxx.svg">,两者都天然支持 fallback(通过alt或 CSS::after) - 音视频:统一走
<video></video>/<audio></audio>,它们的<source></source>和<track></track>已内置多格式回退与文字提示
如何验证 fallback 是否真被触发
别靠肉眼刷新看——多数浏览器缓存了 object 加载失败状态,导致 fallback 不重绘。真实验证必须绕过缓存并观察网络行为。
- 在 DevTools 的 Network 面板过滤
Doc或Other,确认data指向的资源返回的是 404/403 或非预期 MIME(如 text/html 而不是 application/x-shockwave-flash) - 临时把
data指向一个不存在的路径(如data="/404-plugin.swf"),强制触发 error 流程 - 监听
object元素的load和error事件,用console.log打印状态,注意 Safari 对error事件的支持较晚(iOS 15+)
真正麻烦的是跨域资源和 CSP 策略:即使 object 的 data 地址存在,CSP 的 object-src 限制也会让加载静默失败,此时 fallback 不触发,页面卡在空白。这种情况下,得先检查响应头里的 Content-Security-Policy 字段是否允许对应源。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










