如何将iframe内容复制到div？

问题描述：

查看下面的代码片段。我希望iframe中的输出文本显示在#source div中。我很努力，并对任何想法表示感谢。如何将iframe中的输出文本复制到div？（剧本写道： “能看到的文字！” 在DIV #show如果格#sourcediv包含 “文本”，否则 “不能见文！”。）记住如何将iframe内容复制到div？

<html> 
 
<body> 
 

 
<div id="source"></div> 
 
<div id="show"></div> 
 

 
<script> 
 
if (document.getElementById('source').innerHTML.indexOf("Text") != -1) 
 
{document.getElementById('show').innerHTML="Can see text!";} 
 
else{document.getElementById('show').innerHTML="Cannot see text!";} 
 
</script> 
 

 
<iframe id="iframe" src="http://majaulrika.esy.es/text.txt"> 
 

 
</body> 
 
</html>

是iframe的域是一样的您的网站？如果没有，你可以改变iframe的网站内容吗？答案不是，所以你不能。 –

@Mosh Feu iframe的域名与我的网站相同。 – mud

我建议不要使用iframe，这不再是1999年。现在，他们有一个有用的目的，即异步文件上传。由于你标记的PHP，尝试['file_get_contents（）']（http://php.net/manual/en/function.file-get-contents.php） – Xorifelse

答

牢记这您IFRAME是为您的网页同一个域：

// Get your iframe element 

var iframe = document.getElementById('iframe'); 

// Access contents of it like this 

var iframeContent = iframe.contentWindow.document; 

// Get your div element 

var content = document.getElementById('source'); 

// set contents of this div to iframe's content 

content.innerHTML = iframeContent.innerHTML;

取决于当你这样做时，它也可能是值得等到了iframe负载：

iframe.onload = function() { /* put the above code here */ }

感谢您的输入。不幸的是我没有得到它的工作。我把正好在身体标签上方。我究竟做错了什么？谢谢！ – mud

答

进一步您comment：

一个更好的解决方案，使内容从文件是使用AJAX。

下面是一个在jQuery中使用ajax的简单方法。

$.ajax({ 
    url: 'http://output.jsbin.com/sebusu', 
    success: function(data) { 
    $('#source').html(data); 
    $('#show').text(function(){ 
     if (data.indexOf('Text') != -1) { 
     return 'Can see text!'; 
     } 
     else { 
     return "Can't see text!"; 
     } 
    }); 
    }, 
    error: function(){ 
    console.log(error); 
    } 
});

<div id="source"></div> 
<div id="show"></div> 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

Live Demo

再次，你只能为你的网站AJAX调用（有一些exceptions）

你的代码工作！但我的目标不是从iframe的源文件读取，而是从iframe中的内容读取。为什么我首先要问，将iframe内容复制到div的方式，是因为我有一个

（续。评论:)基本上，我想要做的是搜索文本文件并获取所有行包含搜索词根据线（S）是什么含有（S）我想不同的结果例：文本文件的内容： “A1（在同一行） B1（另一条线） B2（另一行） “ 如果我搜索”A“，我想显示一个文字说”你有1！“如果我搜索”B“，我想显示一个文本字符串，说”嘿，你有1和2！ “ 我非常感谢你的所有输入！有任何想法吗？ – mud

因此，不要在iframe中打开它，只需使用ajax调用'search.php'，获取数据并用此数据写入一些HTML，或者您可以在服务器中创建HTML，并将ajax的回调函数写入DOM 。精明？ –

如何将iframe内容复制到div？

相关推荐