是否可以使用 jQuery 编辑通过 <iframe> 加载的 DOM 元素？答案

【问题标题】：Is it possible to edit DOM elements that get loaded via an <iframe> with jQuery?是否可以使用 jQuery 编辑通过 <iframe> 加载的 DOM 元素？
【发布时间】：2010-09-26 08:41:17
【问题描述】：

我有以下 HTML 代码：

<body>
  ...
  <div id="users">
      <iframe src="http://control.intranet/userlist.php" height="100">
  </div>
  ...
</body>

//control.intranet/userlist.php 从我们的 Intranet 控制面板加载用户列表。

此列表如下所示：

<div class="user">
    <span class="name">Boda Cydo</span>
    <span class="ip">10.42.12.2</span>
    ...
</div>
<div class="user">
     ...
</div>
...

现在我想格式化用户列表的外观，所以我尝试用 jQuery 匹配其中的元素：

$("#users .name").css("background-color", "#FF0000")

但它从不匹配单个.name。

我什至只尝试了$("#users").length，它返回 0。

这让我觉得我无法使用 jQuery 编辑通过 iframe 加载的 DOM 元素。真的吗？如果是这样，我如何编辑通过 iframe 加载的元素的 CSS？

谢谢，博达·赛多。

【问题讨论】：

Javascript callback when IFRAME is finished loading?的可能重复
父页面是否也托管在control.intranet 上？如果没有，这会因跨域安全问题而变得复杂。
它在monitor.extranet，我可以从它访问control.intranet的iframe吗？

标签： jquery html css dom

【解决方案1】：

.contents() 方法也可以是用于获取一个内容文档 iframe，如果 iframe 在同一个域作为主页。

发件人：http://api.jquery.com/contents/

【讨论】：

【解决方案2】：

试试

$("#iframeid").contents().("#users .name").css("background-color", "#FF0000");

只有当您的 iframe 和主页属于同一个域时，它才会起作用。

【讨论】：

有没有办法跨域？

【解决方案3】：

快速谷歌搜索给了我：http://simple.procoding.net/2008/03/21/how-to-access-iframe-in-jquery/

【讨论】：