如何使用 iframe 显示另一个网站?

Posted

技术标签:

【中文标题】如何使用 iframe 显示另一个网站?【英文标题】:How to use iframe to show another website? 【发布时间】:2017-04-10 10:45:17 【问题描述】:

网页正在加载,没有任何错误,但是当我单击按钮加载 iFrame 时没有任何反应。谁能告诉我如何在 WordPress 中修复它,是他们的任何插件来解决这个问题。

【问题讨论】:

很高兴编辑您的帖子并提供更多详细信息,例如清楚地说明预期的点击行为和/或您收到的错误。 【参考方案1】:

首先,你有错误的双 <script> 包装:

<script>
      <script type="text/javascript">
      ...

而且您没有点击按钮处理程序。所以点击后不会有任何反应。 你在 URL 上还有一个奇怪的部分“.product-list”。你想用它做什么? 也许你正在寻找这样的东西?

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function () 
            $('#fetch-btn').click(function () 
                jQuery("#div1").load("any-url");
            );
        );
    </script>
</head>
<body>

<div id="div1" class="product-list"></div>

<button id="fetch-btn">Get External Content</button>

</body>
</html>

但它仍然无法将整个外国网站内容加载到您的 div 中。您应该为此使用 iframe。您应该阅读有关CORS 的信息并尝试使用您的域的任何代理。 对你有帮助吗?

【讨论】:

【参考方案2】:

如果您想与内部网站交互,请尝试使用 iframe

【讨论】:

【参考方案3】:

您不能从其他站点下载数据。 使用 php 编写的简单代理!

echo (file_get_contents($_POST['url']));

并使用 jQuery!

$.ajax(
  url: "./your_proxy.php",
  type: "POST",
  data: 
    url: 'https://www.youtube.com'
  ,
  dataType: "html",
  success: function(data) 
    var d = $(data); // your data
  
);

【讨论】:

以上是关于如何使用 iframe 显示另一个网站?的主要内容,如果未能解决你的问题,请参考以下文章

如何裁剪 iframe 的内容以显示页面的一部分?

iframe如何自动随嵌入另一网站页面内容高度的变化页变化呢

用iframe框架调用了另一个页面,如何显示指定的某一块区域呢

如何裁剪Iframe的内容以显示页面的一部分?

请问如何在一个iFrame中嵌套并显示另一个iFrame

如何在一个页面上加载具有相同 src 的多个 iframe