Question

<!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>
      <script type="text/javascript">
        jQuery(document).ready(function(){
            jQuery("#div1").load("https://www.ae.com/men-s-clearance/web/s-cat/6470582?icid=Clearance:CHP:sec1:Clearance:MensClearance:ShopMen  .product-list");
        });
      </script>
    </script>
  </head>
  <body>

    <div id="div1"></div>

    <button>Get External Content</button>

  </body>
</html>

以上代码正在运行，但是当我点击按钮时没有任何反应。

Answer 1

尝试使用iframe，如果您想与内部网站进行互动

Answer 2

您无法从其他网站下载数据。使用用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
  }
});

Answer 3

首先，你有错误的双<script>包装：

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

而且你没有点击按钮处理程序。所以点击后你无法得到任何反应。你也有一个奇怪的部分＆＃34; 。产品列表＆＃34;在URL。你想要什么？也许你正在寻找像这样的smth？

<!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并尝试使用您的域名代理。它对你有帮助吗？

在另一个网站中加载div类

3 个答案: