Javascript jQuery、ajax、在其他页面内部显示页面（如iframe）

我需要在页面内部显示一个页面，就像iframe一样，但使用jquery。这些页面不在同一台服务器上

主页是cms内部的html页面，需要嵌套的页面是位于另一台服务器上的包含图像或音频文件列表的媒体页面。媒体页面上的高度会有所不同，所以我有点想远离iframes。。。在jquery中是否有一个简单的调用可以抓取像iframe这样的页面。。。或者如果在浏览器级别关闭js，会降级为iframe

---

谢谢。

除非您的外部内容是从与主网站相同的域提供的，否则使用AJAX实现类似的功能并不是那么容易，因为您会遇到问题

解决同一来源策略的一个解决方案是在服务器上设置一个简单的服务器，这将允许浏览器使用AJAX请求的相对路径，而服务器将充当任何远程位置的代理

如果在Apache中使用，设置反向代理的基本配置指令是

ProxyPass

。它通常使用如下：

ProxyPass     /external/     http://other-domain.com/

$('#your_div').load('external/index.html');

在这种情况下，浏览器将能够请求

/external/index.html

作为相对URL，但服务器将充当

http://other-domain.com/index.html

然后在JavaScript中，您可以使用jQuery方法，如下所示：

ProxyPass     /external/     http://other-domain.com/

$('#your_div').load('external/index.html');

另一个选项是使用iframe，并使用JavaScript动态调整其高度。您可能希望查看以下堆栈溢出帖子，以便进一步阅读此主题：

---

您可能还想考虑一个完整的服务器端解决方案，如上面的注释所建议的。在将HTML提供给客户端浏览器之前，可以将外部站点的HTML注入主站点

您将很难从其他域获取Ajax内容。浏览器不允许它阻止跨站点脚本攻击（XSS）。您可以使用基于php的代理、cURL或google Ajax API

---

另一种选择是只使用iframe，让JavaScript获取内容高度，并将iframe高度设置为相同（加上填充，这样浏览器就不会显示滚动条）

Ajax根据定义只能在同一台服务器上工作，这是由于同源策略。您需要做的是将另一台服务器的页面加载到一个PHP文件中（我们称之为xxx.PHP）。 然后，您可以使用以下代码在div yyy中加载xxx.php：

$("#yyy").load("xxx.php");

---

Mozilla增加了跨站点请求。这是一个新的HTML5标准。但通用不允许跨站点请求。所以你必须做一些前面提到的事情。如果要使用PHP解决方案，请使用以下方法：

<?php
    $external = file_get_contents($_POST['external']);
    echo $external;
?>

$().post("ajax.php", {external: "http://www.example.com/"}, function(data) {
    html = $("div#extract", data).html();
    $("div#insert").html(html);
}, "html");

$（）.post（“ajax.php”，{external:http://www.example.com/“}，函数（数据）{
html=$（“div#extract”，data）.html（）；
$（“div#insert”）.html（html）；
}，“html”）；

这里的问题是“其他服务器”位。Javascript的跨域限制意味着Javascript所做的任何事情都不能与运行它的域之外的域进行交互。您是否考虑过服务器端解决方案？您知道，问题是，您可以通过将请求传递给服务器来“获取”页面，从而绕过跨域问题（例如我对这个问题的回答），但它仍然无法复制

iframe

的功能，因为该页面上的CSS和Javascript会“溢出”并影响父页面，不像inframe那样包含它。谢谢大家。我将尝试使用代理，如果这不起作用，我可能会使用jsheight创建iframe。