如何将 DOM 数据从一个窗口传输到另一个窗口？

Posted 2023-05-09

【中文标题】如何将 DOM 数据从一个窗口传输到另一个窗口？

【英文标题】：How to transfer DOM data from one window to another?

【发布时间】：2014-12-31 04:11:12

【问题描述】：

我正在尝试创建一个 jQuery/javascript 函数，通过该函数来自网页上多个 divs 的数据用于填写 Chrome 中相邻窗口或选项卡上的表单。

我能够捕获数据，但是否有访问其他选项卡的方法，或者我必须创建 Chrome 扩展程序？

【问题讨论】：

如果您不控制这两个页面，那么是的，您将需要一个扩展程序。如果您同时控制两者，可能还有其他方法（想到postMessage）

【参考方案1】：

取决于你是否对这两个页面都有控制权。

如果您不控制接收页面，那么访问其 DOM 的唯一方法是通过注入 Content Script 的 Chrome 扩展程序。它将能够访问页面的表单以填写它，并与其他选项卡进行通信，例如通过后台页面。

如果您想尝试开发这样的扩展，我强烈建议仔细阅读Overview 页面。

如果您确实控制有问题的页面，这是一个有点奇怪的目标，但可以实现。

假设页面位于同一个域中。然后他们分享localStorage/sessionStorage，如果你在另一个中修改change event，它会在一个中触发。

如果它们不在同一个域中但你控制它们，你可以考虑使用postMessage来传输数据。

请注意：您的问题是“传输 DOM 数据”。上述所有解决方案都只会传输JSON-serializable 数据（或字符串）。一些与 DOM 相关的数据，例如 htmlElements 本身，无法完全序列化。