Javascript Iframe innerHTML - PullRequest
       28

Javascript Iframe innerHTML

18 голосов
/ 26 сентября 2008

Кто-нибудь знает, как получить HTML-код из IFRAME? Я пробовал несколько разных способов:

document.getElementById('iframe01').contentDocument.body.innerHTML
document.frames['iframe01'].document.body.innerHTML
document.getElementById('iframe01').contentWindow.document.body.innerHTML

и т.д.

Ответы [ 10 ]

15 голосов
/ 26 сентября 2008

Я думаю, это то, что вы хотите:

window.frames['iframe01'].document.body.innerHTML 

EDIT:

У меня есть все основания полагать, что это не сработает в Chrome и Firefox, хотя и отлично работает в IE, где я и тестировал. Оглядываясь назад, это была большая ошибка

Это будет работать:

window.frames[0].document.body.innerHTML 

Я понимаю, что это не совсем то, о чем спрашивали, но не хочу удалять ответ, потому что я думаю, что у него есть место.

Мне нравится ответ jquery @ ravz ниже.

11 голосов
/ 18 августа 2010

Будет работать что-то вроде следующего.

<iframe id = "testframe" onload = populateIframe(this.id);></iframe>

// The following function should be inside a script tag

function populateIframe(id) { 

    var text = "This is a Test"
var iframe = document.getElementById(id); 

var doc; 

if(iframe.contentDocument) { 
    doc = iframe.contentDocument; 
} else {
    doc = iframe.contentWindow.document; 
}

doc.body.innerHTML = text; 

  }
8 голосов
/ 26 сентября 2008

Если вы посмотрите на JQuery , вы можете сделать что-то вроде:

<iframe id="my_iframe" ...></iframe>

$('#my_iframe').contents().find('html').html();

Это предполагает, что ваш родитель и дочерний элемент iframe находятся на одном и том же сервере из-за Одинаковой политики происхождения в Javascript.

5 голосов
/ 12 декабря 2012

Конрой ответил правильно. В случае, если вам нужны только вещи из тега body, просто используйте:

$('#my_iframe').contents().find('body').html();
2 голосов
/ 03 сентября 2011

Для этой цели вы можете использовать свойство contentDocument или contentWindow. Вот пример кода.

function gethtml()
{
var x=document.getElementById("myframe");
var y=(x.contentWindow || x.contentDocument);
if (y.document)y=y.document;
alert(y.body.innerHTML);
}

здесь, мой фрейм - это идентификатор вашего фрейма. Примечание. Вы не можете извлечь контент из iframe из src вне вашего домена.

2 голосов
/ 26 сентября 2008

Не забывайте, что вы не можете пересекать домены из-за безопасности.

Так что, если это так, вы должны использовать JSON .

1 голос
/ 15 января 2019

Это решение работает так же, как iFrame. Я создал PHP-скрипт, который может получить все содержимое с другого сайта, и наиболее важной частью является то, что вы можете легко применить свой собственный jQuery к этому внешнему контенту. Пожалуйста, обратитесь к следующему сценарию, который может получить все содержимое с другого веб-сайта, а затем вы также можете применить свой cusom jQuery / JS. Этот контент может использоваться где угодно, внутри любого элемента или любой страницы.

<div id='myframe'>

  <?php 
   /* 
    Use below function to display final HTML inside this div
   */

   //Display Frame
   echo displayFrame(); 
  ?>

</div>

<?php

/* 
  Function to display frame from another domain 
*/

function displayFrame()
{
  $webUrl = 'http://[external-web-domain.com]/';

  //Get HTML from the URL
  $content = file_get_contents($webUrl);

  //Add custom JS to returned HTML content
  $customJS = "
  <script>

      /* Here I am writing a sample jQuery to hide the navigation menu
         You can write your own jQuery for this content
      */
    //Hide Navigation bar
    jQuery(\".navbar\").hide();

  </script>";

  //Append Custom JS with HTML
  $html = $content . $customJS;

  //Return customized HTML
  return $html;
}
1 голос
/ 16 февраля 2015

Вы можете получить исходный код из другого домена, если вы установите фильтр ForceCORS в Firefox. Когда вы включите этот фильтр, он пропустит функцию безопасности в браузере, и ваш скрипт будет работать, даже если вы попытаетесь прочитать другую веб-страницу. Например, вы можете открыть FoxNews.com в iframe, а затем прочитать его источник. Причина, по которой современные веб-обозреватели отрицают эту возможность по умолчанию, заключается в том, что если в другом домене есть фрагмент JavaScript, а вы читаете его и отображаете на своей странице, он может содержать вредоносный код и представлять угрозу безопасности. Таким образом, всякий раз, когда вы отображаете данные из другого домена на своей странице, вы должны остерегаться этой реальной угрозы и реализовывать способ отфильтровывать весь код JavaScript из вашего текста перед его отображением. Помните, что когда предполагаемый фрагмент необработанного текста содержит некоторый код, заключенный в теги скрипта, он не будет отображаться, когда вы отобразите его на своей странице, тем не менее, он будет работать! Итак, осознайте, что это угроза.

http://www -jo.se / f.pfleger / forcecors

1 голос
/ 19 июня 2014
document.getElementById('iframe01').outerHTML
0 голосов
/ 29 мая 2018

Вы можете получить html из iframe, используя этот код iframe = document.getElementById ('frame'); innerHtml = iframe.contentDocument.documentElement.innerHTML

...