访问和修改 iframe 内容，postMessage vs jQuery.content(）

Accessing and modifying iframe contents, postMessage vs jQuery.contents()

本文关键字：jQuery vs content postMessage 修改 iframe 内容访问更新时间：2023-09-26

这是可能的

$('#iframe_id').contents().find('.stuff_to_modify).addClass('whatever');

但也可以使用 window.postMessage 事件，方法是从 iframe 向脚本发送do_something消息，该脚本在收到消息时进行修改（添加该类）。

我

想知道我应该走哪条路，这两种方法之间有什么区别（缺点、优点）。

jQuery方法似乎更好，因为我不再需要在我的iframe中包含任何脚本

。

window.postMessage 和你给出的 jQuery 示例之间的主要区别在于，postMessage 支持跨源通信。

这意味着，如果托管 iframe 的父页面来自域 A，而 iframe 的内容来自域 B，则 postMessage 允许您进行通信，而 jQuery 方法将导致安全错误。

您提供的链接是浏览器的 window.postMessage 实现的 java 脚本包装器，并回退到不支持它的浏览器的窗口位置哈希轮询。其他好处列在您的链接本身中。

因此，如果两个页面来自同一来源，即来自同一域，那么您可以使用jQuery方法本身。如果它来自两个不同的来源，您可能必须使用 JS 包装器。