使用jQuery获取iframe的html内容

我目前正试图自定义OpenCms（基于Java的开源CMS），它使用嵌入的FCKEditor，这是我试图使用js/jQuery访问。使用jQuery获取iframe的html内容

我尝试获取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 /传情” HTML部分，其目前持有的价值观“时事开讲恩...“。下面你还可以看到Firebug中的html结构。

但是，$(editFrame).contents().html()返回null，我不知道为什么，而$(editFrame).attr('id')返回正确的ID。

iframe内容/ FCKEditor位于同一站点/域，不存在跨站点问题。

enter image description here

iframe的

HTML代码为http://pastebin.com/hPuM7VUz

更新时间：

这里是一个可行的解决方案：

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');

来源

2012-01-11 Mathias Conradt

.contents（）HTML（）不工作得到一个iframe的HTML代码。你可以做到以下几点：

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

这应该返回iframe中的所有html给你。或者，您可以使用“body”或“head”而不是“html”来获取这些部分。

来源

2012-01-11 05:19:35 Tim

谢谢，许多有用的答复完全;我编辑了我的问题，并在底部添加了最终解决方案。 – 2012-01-11 09:36:16

这适用于Firefox，但不适用于Chrome。我刚刚得到。 – user3411192 2016-09-07 21:02:40

我觉得FCKEditor的有自己的API见http://cksource.com/forums/viewtopic.php?f=6&t=8368

来源

2012-01-11 05:10:14

我建议用替换第一行：

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

...和第二警报表达：

editFrame.html()

如果，另一方面，你愿意来完成相同的W/ØjQuery的（冷得多，恕我直言）可以使用只有JavaScript：

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

来源

2012-01-11 05:11:36 Nathan

jQuery对于有点的DIV不能很好地播放。在id中，我不能很容易地更改FCKEditor组件的id（很容易）。我将对以上测试提出建议，并将在稍后发布解决方案，我终于使用了该解决方案。谢谢大家。 – 2012-01-11 08:38:24

你就能得到上述内容作为

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

但框架应该是在同一个域中参考http://simple.procoding.net/2008/03/21/how-to-access-iframe-in-jquery/

来源

2012-01-11 05:20:32

你的iframe：

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

我们可以从这个iframe中获取数据 as：

var content=$("iframe").contents().find('body').html(); 
alert(content);

来源

2014-11-19 05:20:15

使用jQuery获取iframe的html内容

回答

相关问题