Ajax/jQuery - 在页面加载时将网页内容加载到div中？

问题描述：

不使用内部框架，是有可能例如加载的Ajax/jQuery - 在页面加载时将网页内容加载到div中？

<div id="siteloader"></div>

的内容物与外部站点somesitehere.com

当页面加载？ - 我知道如何从文件加载内容，但不知道如何加载整个网站？

非常感谢，

答

这是可能没有iframe专门做。由于标题中提到了jQuery，因此可以使用jQuery。

<!doctype html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Load remote content into object element</title> 
    </head> 
    <body> 
    <div id="siteloader"></div> 
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 
    <script> 
     $("#siteloader").html('<object data="http://tired.com/">'); 
    </script> 
    </body> 
</html>

注意，如果远程页面的[X-Frame-Options标题]（https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options）不允许使用它，则这将不起作用。 – 2014-05-24 20:37:47

答

您无法使用AJAX从其他网站（域）注入内容。 iFrame适用于这些类型的事情的原因是，您可以将来源指定为来自其他域。

答

看看到jQuery's .load()功能：

<script> 
    $(function(){ 
     $('#siteloader').load('http://www.somesitehere.com'); 
    }); 
</script>

然而，这仅适用于JS文件的同一个域。

此jQuery .load（）方法比其他响应中提出的jQuery .get（）更好，因为它允许您从外部URL DOM中加载特定项目（例如，仅包含一个股利，而不是整页）。这样你就可以避免像两个“body”一样重复标记，所以：$（'＃result'）。load（'ajax/test.html #container'）; – tomasofen 2013-04-01 07:28:50

答

使用jQuery，有可能，但不能使用ajax。

function LoadPage(){ 
    $.get('http://a_site.com/a_page.html', function(data) { 
    $('#siteloader').html(data); 
    }); 
}

，然后将body标签onload="LoadPage()"。

但如果你遵循这条路线，一个PHP版本可能会更好：

echo htmlspecialchars(file_get_contents("some URL"));

+24

你不觉得'$ .get'是Ajax吗？ – xyz 2012-04-01 11:01:45

不，这在ajax中是不可能的，但仅在jQuery中才有可能。一旦页面已经加载将页面转储到指定的div中，$ .get（）就可以被调用。 – Njdart 2012-04-01 11:04:29

您的示例在jQuery中使用Ajax。我认为你正试图解释一些与你的例子不同的东西。 – xyz 2012-04-01 11:06:21

Ajax/jQuery - 在页面加载时将网页内容加载到div中？

相关推荐