使用Javascript的Iframe的innerHTML(Javascript Iframe in

2019-07-05 12:48发布

有谁知道如何让HTML iframe之外的我已经尝试了几种不同的方式:

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

等等

Answer 1:

我认为这是你想要什么:

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

编辑:

我有充分根据,这将不会在Chrome和Firefox浏览器,虽然它完美的IE浏览器,这是我测试过它。 现在回想起来,这是一个很大的错误

这将工作:

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

我明白,这不正是有人问,但不希望删除的答案,因为我觉得它有一个地方。

我喜欢@下面ravz的jQuery的答案。



Answer 2:

有像下面这样是可行的。

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

  }


Answer 3:

如果你看一看JQuery的 ,你可以这样做:

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

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

这是假设你的iframe的父母和孩子居住在同一台服务器上,由于同源策略在Javascript。



Answer 4:

康罗伊的答案是正确的。 在这种情况下,你从身体标签只需要的东西,只需使用:

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


Answer 5:

不要忘记,你不能越过,因为安全的领域。

所以,如果是这样的话,你应该使用JSON 。



Answer 6:

您可以使用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的ID。 注意:您不能提取一个src内容iframe之外的你在外域。



Answer 7:

document.getElementById('iframe01').outerHTML


Answer 8:

如果你安装在Firefox上ForceCORS过滤器,你可以从另一个域的来源。 当您打开此过滤器,它会绕过安全功能的浏览器,即使你尝试读取另一个网页脚本会工作。 例如,你可以在一个iframe打开FoxNews.com,然后读取其来源。 究其原因现代网络brwosers否认这种能力在默认情况下是因为如果其他域包括一段JavaScript和您正在阅读和您的网页上显示,它可能包含恶意代码,并构成安全威胁。 所以,当你从你的页面上的其他域显示的数据,必须警惕这种真正的威胁并实施办法从你的文字过滤掉所有的JavaScript代码你要显示它之前。 请记住,当原始文本的假定一块包含脚本标记中包含一些代码,就不会显示出来,当你显示它您的网页上,但他们会跑! 因此,意识到这是一个威胁。

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



Answer 9:

该解决方案为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;
}


Answer 10:

可以使用这个代码IFRAME =的document.getElementById(“框架”)得到的HTML出的iframe; 的innerHTML = iframe.contentDocument.documentElement.innerHTML



文章来源: Javascript Iframe innerHTML