修改Object标签的data属性无法重载，因浏览器仅首次插入DOM时读取data；必须销毁旧节点并重建新节点，同时注意type匹配、事件重绑及兼容性问题。
Object 标签的 data 属性改了为啥不重载
不能靠修改 data 属性实现重载——这是最常踩的坑。浏览器只在 <object> 首次插入 DOM 时读取一次 data 值，后续用 JS 修改它（比如 obj.data = "new.pdf"）完全无效，既不会重新请求资源，也不会更新已渲染内容。
真正可行的重载方式：销毁 + 重建
必须替换整个 DOM 节点，而不是“刷新属性”。本质是“换人”，不是“换衣服”。
- 先从 DOM 中移除旧的
<object>元素（remove()或replaceChild()） - 再创建一个全新
<object>，设置好data、type、id等属性 - 最后插入到原位置（
appendChild()或insertBefore()） - 如果原来绑定了事件监听器（如
load、error），需在新元素上重新绑定
容易被忽略的兼容性细节
即使你正确重建了元素，仍有几个隐性问题会卡住：
-
type属性必须准确匹配 MIME 类型（如 PDF 用"application/pdf"），否则某些浏览器（尤其是 Safari）可能静默失败 - 本地文件路径（
file://协议）下，部分 WebView 不支持object加载，建议优先用<iframe>替代 - PDF 加载完成事件不可靠：
load在 Chrome 可能不触发，推荐监听onreadystatechange或用定时轮询contentDocument?.readyState - 若原
<object>是通过innerHTML插入的，重建时避免直接拼 HTML 字符串，防止引号/转义错误；用document.createElement("object")更安全
替代方案比硬刚 object 更实用
除非业务强依赖 object 的特定行为（如 ActiveX 或旧版插件），否则以下方式更可控：
立即学习“前端免费学习笔记（深入）”；
- PDF：用
<iframe src="doc.pdf">，支持src动态更新，且各浏览器行为一致 - 视频/音频：直接用
<video>或<audio>，调load()方法即可重载 - 通用二进制资源：fetch + URL.createObjectURL() +
<iframe>或<embed>，全程可编程、可拦截错误
硬套 object 的重载逻辑，往往是因为没意识到它的设计定位早已过时——它本就不是为动态场景设计的。
