data属性仅在<object>首次插入DOM时生效，修改无效；需非空合法URL、匹配MIME类型、同源且服务端返回正确Content-Type，动态切换须重建元素。
data 属性不是“填个路径就能用”的万能开关，它只在 <object> 首次插入 DOM 时生效，且是否渲染完全取决于路径有效性、MIME 类型匹配和浏览器策略。直接改 data 值不会重载资源，这是最常被误用的点。
data 属性为空或非法时，浏览器根本不发起请求
很多人以为写个空字符串或错路径会触发 fallback，实际不是：data=""、data=" "、data="javascript:void(0)" 都会让 <object> 进入“未激活”状态——不 fetch、不报错、也不显示内部 fallback 内容。
- 必须确保
data是非空、可解析的 URL（如data="report.pdf"或data="./assets/chart.svg"） - 含中文或特殊字符的 URL 必须编码，
data="doc.pdf?name=张三"会失败，应写成data="doc.pdf?name=%E5%BC%A0%E4%B8%89" -
file://协议在现代浏览器中默认被阻止，控制台通常静默，不提示也不渲染
PDF 嵌入必须同时满足三个条件才可能显示
仅写 data="manual.pdf" 几乎必然失败。PDF 能否内嵌渲染，取决于服务端响应头、浏览器设置和同源策略三者共同作用。
- 服务器必须返回
Content-Type: application/pdf，否则 Safari 会拒绝渲染，Chrome 可能转为下载 - 浏览器需启用内置 PDF 查看器（例如 Chrome 中访问
chrome://settings/content/pdfDocuments确认开启） - 路径必须同源，跨域 PDF 会被 CORS 拦截，控制台报
Blocked loading resource from cross-origin URL - 建议补全
type="application/pdf"和显式宽高，如<object data="manual.pdf" type="application/pdf" width="800" height="600"></object>
动态切换 data 值必须重建 object 元素
JavaScript 修改 el.setAttribute('data', 'new.pdf') 完全无效。现代浏览器（Chrome/Firefox/Safari）对已挂载的 <object> 的 data 变更不响应，也不会重新发起请求。
立即学习“前端免费学习笔记（深入）”；
- 正确做法是：创建新
<object>元素，完整设置data、type、width、height，如有<param>子节点需手动克隆 - 用
el.parentNode.replaceChild(newObj, el)替换旧节点，而非修改属性 - 为避免闪屏，可先设
newObj.style.display = 'none'，监听load事件后再显示
相对路径解析依赖 HTML 文档 URL，不是当前 JS 执行位置
data="chart.svg" 的解析基准永远是当前 HTML 文件所在 URL，跟 JS 文件在哪、webpack 怎么打包、甚至 <base> 标签都无关——除非你显式用了 codebase（已基本废弃）。
- 如果 HTML 在
/app/index.html，而 SVG 在/assets/chart.svg，就得写data="../assets/chart.svg"或data="/assets/chart.svg" - 构建工具（如 Vite/Webpack）若重写静态资源路径，需同步更新
data值，不能指望运行时自动修正 - 绝对 URL（
data="https://cdn.example.com/file.pdf"）必须配好 CORS 头，否则即使路径对也白搭
真正难的从来不是写对 data，而是搞清它什么时候“算数”、什么时候被忽略、以及为什么 fallback 没出现——这些边界行为在不同浏览器、不同部署环境里差异极大，必须逐项验证，不能靠猜测。
