JQUERY gotcha，为什么我不能在本地托管的 iframe 中进行更改？答案

【问题标题】：JQUERY gotcha, Why can't I change inside an iframe that is hosted locally?JQUERY gotcha，为什么我不能在本地托管的 iframe 中进行更改？
【发布时间】：2010-04-16 22:10:41
【问题描述】：

在页面上给出以下内容：

<iframe frameborder="0" allowtransparency="true" tabindex="0" src="" title="Rich text editor" style="width: 100%; height: 100%;" id="hi-world">
<p><span class="tipoff" title="System tooltip for search engines">Download now</span></p><p>adasdads</p><p>a</p><p><span class="tipoff" title="System tooltip for search engines">Download n1111ow</span></p>
</iframe>

以下作品：

$('#hi-world').css("width","10px");

但我想做的是更改 iFrame 中的段落，这不起作用：

$('#hi-world').find('p').css("background","red");

【问题讨论】：

这没有任何意义。这不是您将内容放入<iframe> 的方式。 <iframe> 创建一个嵌入在外部窗口中的单独窗口。您必须通过 HTTP 请求加载其内容。
@Pointy，实际上 iframe 是完全可编写脚本的，只要它是同域的。
它们是可编写脚本的，当然；这不是我的本意。我指的是标记中<iframe> 中的“内容”。也许这行得通，如果是这样，这不是第一次让我感到惊讶。
@Pointy。对不起，我误解了你的意思。你是对的，硬编码的子元素通常不会显示。一个明显的例外是 iframe 标记无法识别（或可能被禁用）。

标签： javascript jquery dom iframe live

【解决方案1】：

好吧，刚刚想通了：

$('#hi-world').contents().find('p').css("background","red");

【讨论】：

注意：您可以接受自己的答案（一旦时间限制结束）

【解决方案2】：

首先是改变 iframe 元素的 css。要执行第二个操作，您必须访问contentDocument。如前所述，在 jQuery 中，您可以为此使用 contents。

【讨论】：