Javascript 在不重新加载页面的情况下，将_top窗口的内容替换为iframe的内容_Javascript_Jquery

Javascript 在不重新加载页面的情况下，将_top窗口的内容替换为iframe的内容

javascript jquery

Javascript 在不重新加载页面的情况下，将_top窗口的内容替换为iframe的内容,javascript,jquery,Javascript,Jquery,是否可以用iframe中加载的文档替换浏览器窗口（_TopFrame）的内容，而无需发出新的GET来加载该文档大概是这样的： <html> <head> <script type="text/javascript" language="JavaScript"> $(document).ready(function() { $("#link").click(function() { // should present in the browser

是否可以用iframe中加载的文档替换浏览器窗口（_TopFrame）的内容，而无需发出新的GET来加载该文档

大概是这样的：

<html>
<head>
<script type="text/javascript" language="JavaScript">
$(document).ready(function() {
  $("#link").click(function() {
    // should present in the browser window the content of the iframe WITHOUT reload
    // even preserve javascript/head code
    $(document).html($("#frameDestination").html());
  });
});
</script>
</head>
<body>
<a id="link" href="#">full window</a>
<iframe id="frameDestination" src="http://www.some-random-site.com" width="900px" height="500px"></iframe>
</body>
</html>


$（文档）.ready（函数（）{
$（“#链接”）。单击（函数（）{
//应在浏览器窗口中显示iframe的内容，而无需重新加载
//甚至保留javascript/头代码
$（document.html（$（“#frameDestination”）.html（））；
});
});

在jQuery中使用iframe时使用contents（）

$("#YourIframe").contents().find("html").html();

只有当iframe与父对象在同一域中时，这才有效。

我没有测试跨域，但在同一域中，我使用了以下脚本：

$(document).ready(function() {
  $("#link").click(function() {
    var iframeBody = document.getElementById("frameDestination").contentDocument,
    head = iframeBody['head'].innerHTML, 
    body = iframeBody['body'].innerHTML;
    $('body').html( body );
    $('head').html( head );
  });
});

在最新的Firefox中，我甚至可以在框架的脚本标记中设置一个变量，并在点击链接后在_top中看到该值

让我确保我们正确理解了这个问题：您有一个带有锚定标记和iframe的页面。单击锚定标记，您希望整个页面成为iframe中的内容（而不进行任何HTTP请求）？我想不出任何可能的方法。可以重新定位iframe以覆盖整个浏览器窗口，但它仍将嵌套在原始页面中。@jbabey完全正确！我想通过在浏览器的地址栏中键入URL来模拟页面的加载。我不想再次往返到服务器，要求获得相同的HTML文档，因为它已经加载到iframe中。如果它设置了正确的缓存头，它不会命中服务器。谢谢@gitnija！对于同一个域，它就像一个符咒，但只是在不同的域中测试了它，不起作用（FF和Chrome）。我已经读到，如果iframe src是由javascript设置的，那么跨域限制就不适用，但我还没有测试过。您是否能够在您的情景中使用javascript动态生成iframe标记？@Gitnija:不适用于：

var ifrm=document.createElement（“iframe”）；ifrm.setAttribute（“src”http://www.somesite.com"); ifrm.setAttribute（“id”、“frameDestination”）；ifrm.style.width=1200+“px”；ifrm.style.height=500+“px”；文件.body.appendChild（ifrm）尝试此操作时遇到两个问题：1）某些域不允许您加载iframe（例如：google.com），2）浏览器拒绝访问这些部分的权限。我知道用户可以在firefox中禁用一些安全设置，这可能会使这成为可能，但前提是用户必须遵循说明。我同意@epascarello的观点，即不能跨域进行。