Получение html-содержимого iframe с использованием jQuery - PullRequest
Новая
       3

Получение html-содержимого iframe с использованием jQuery

24 голосов
/ 11 января 2012

В настоящее время я пытаюсь немного настроить OpenCms (основанную на Java CMS с открытым исходным кодом), которая использует встроенный FCKEditor, к которому я пытаюсь получить доступ, используя js / jQuery.

Я пытаюсь получить html-содержимое iframe, но всегда получаю ноль в качестве возврата.Вот как я пытаюсь извлечь html-контент из iframe: 

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 (!!)

Глядя на скриншот, я хочу получить доступ к html-разделу LargeNews1 / Teaser, который в настоящее время содержит значения.Лента новостей en ... ».Ниже вы также можете увидеть структуру html в Firebug.

Однако $(editFrame).contents().html() возвращает ноль, и я не могу понять, почему, тогда как $(editFrame).attr('id') возвращает правильный идентификатор.

iframecontent / FCKEditor находится на том же сайте / домене, межсайтовых проблем нет.

enter image description here

HTML-код iframe находится по адресу 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');

Ответы [ 6 ]

50 голосов
/ 11 января 2012

.contents (). Html () не работает, чтобы получить HTML-код iframe.Вы можете сделать следующее, чтобы получить его: 

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

Это должно вернуть все HTML в iframe для вас.Или вы можете использовать «body» или «head» вместо «html», чтобы получить эти разделы.

7 голосов
/ 11 января 2012

вы можете получить контент как 

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

, но фрейм должен быть в том же домене, см. http://simple.procoding.net/2008/03/21/how-to-access-iframe-in-jquery/

2 голосов
/ 11 января 2012

Предлагаю заменить первую строку на: 

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

... и второе выражение предупреждения с: 

  editFrame.html()

Если, с другой стороны, вы предпочитаете выполнять то же самое без jquery (намного круче, IMHO), можно использовать только JavaScript: 

  var editFrame = document.getElementById('ta_OpenCmsHtml.LargeNews_1_.Teaser_1_.0___Frame');
  alert(editFrame.innerHTML);
1 голос
/ 11 января 2012

Я думаю, что у FCKEditor есть собственный API. http://cksource.com/forums/viewtopic.php?f=6&t=8368

0 голосов
/ 16 апреля 2019

Попробовав ряд jQuery решений, которые рекомендовали использовать нижеприведенную опцию, я обнаружил, что не могу получить фактическое содержимое <html>, включая родительские теги.

$("#iframeId").contents().find("html").html()

Для меня это работало намного лучше, и я смог извлечь весь контент iframe <html>...</html> в виде строки.

document.getElementById('iframeId').contentWindow.document.documentElement.outerHTML

0 голосов
/ 19 ноября 2014

Ваш iframe: 

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

Мы можем получить данные из этого iframe как: 

var content=$("iframe").contents().find('body').html();
alert(content);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...