Javascript 使用jQuery获取iframe的HTML内容

我目前正在尝试定制一点OpenCms（基于java的开源CMS），它使用的是嵌入式FCKEditor，这就是我尝试使用js/jQuery访问的内容

我尝试获取iframe的html内容，但是，返回值总是为null。 以下是我尝试从iframe获取html内容的方式：

var editFrame = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');
alert( $(editFrame).attr('id') );         // returns the correct id
alert( $(editFrame).contents().html() );  // returns null (!!)

查看屏幕截图，我想访问的是'LargeNews1/striser'html部分，它当前包含值“Newsline en…”。 下面您还可以看到Firebug中的html结构

但是，

$（editFrame）.contents（）.html（）

返回null，我不知道为什么，而

$（editFrame）.attr（'id'）

返回正确的id

iframe内容/FCKEditor位于同一站点/域上，没有跨站点问题

iframe的HTML代码位于

更新：

以下是一个有效的解决方案：

var editArea = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame').contentWindow.document.getElementById('xEditingArea');                        
$(editArea).find('iframe:first').contents().find('html:first').find('body:first').html('some <b>new</b><br/> value');

var editArea=document.getElementById（'ta_OpenCmsHtml.LargeNews_1_1.0__框架'）。contentWindow.document.getElementById（'xEditingArea'）；
$（editArea）.find（'iframe:first'）.contents（）.find（'html:first'）.find（'body:first'）.html（'somenew
value'）；

我认为FCKEditor有自己的API请参见

我建议将第一行替换为：

  var editFrame = $('#ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');

…和具有以下内容的第二个警报表达式：

  editFrame.html()

另一方面，如果您希望完成相同的w/o jquery（更酷，IMHO），那么只能使用JavaScript：

  var editFrame = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');
  alert(editFrame.innerHTML);

.contents（）.html（）

无法获取IFRAME的html代码。您可以执行以下操作来获取它：

$(editFrame).contents().find("html").html();

---

这将为您返回IFRAME中的所有HTML。或者您也可以使用“body”或“head”而不是“html”来获取这些部分

您可以按以下方式获取内容：

$('#iframeID').contents().find('#someID').html();

但是帧应该在同一个域中。请参阅您的iframe:

<iframe style="width: 100%; height: 100%;" frameborder="0" aria-describedby="cke_88" title="Rich text editor, content" src="" tabindex="-1" allowtransparency="true"/>

---

在尝试了许多建议使用下面选项的

jQuery

解决方案后，我发现我无法获得实际的

内容，包括父标记

$（“#iframeId”）.contents（）.find（“html”）.html（）

这对我来说效果更好，并且我能够以字符串的形式获取整个

…

iframe内容

---

document.getElementById（'iframeId'）.contentWindow.document.documentElement.outerHTML

看起来jQuery没有提供获取iFrame的整个HTML的方法，但是由于它提供了对本机DOM元素的访问，因此可以采用混合方法：

$（“iframe”）[0].contentWindow.document.documentElement.outerHTML

这将返回iFrame的HTML，包括
、
和
jQuery不能很好地处理带有点的div。很遗憾，我无法（轻松地）更改FCKEditor组件的id。我将测试上述建议，并将在稍后发布最终使用的解决方案。谢谢大家。谢谢，一共有很多有用的回复；我编辑了我的问题，并在底部添加了最终的解决方案。这在Firefox上有效，但在chrome上无效。我刚刚明白，这应该是公认的答案。
var content=$("iframe").contents().find('body').html();
alert(content);