框架的替代品，包括来自不同服务器的内容

Question

我需要制作一系列网页。每个都有一个来自网站的标题，内容来自我的dropbox / public中的html页面。我简单的方法是使用框架，但它们已被弃用。

由于html内容大小不同。所以iFrame似乎不是正确的工具。

我有哪些替代方案？

许多人似乎在评论中建议ajax与jsonp。不幸的是，我对这些方法完全不熟悉，所以我需要一个例子来复制然后使用。

谢谢， 彼得

Answer 1

您需要在主页面中拥有Jquery库。将以上代码复制到页面标题上：

<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>

使用response id：

创建一个div

<div id="response"></div>

JQuery有一个名为“load”的AJAX函数，这个函数被附加到你想要加载页面的选择器，在这种情况下我们希望文件“exemple.html”的内容加载到id为的标签中“响应”。

<script>

$(document).ready(function(){
    // load exemple page when the page loads
    $("#response").load("exemple.html");
});

</script>

此外，您可以在点击主页面的链接时加载内容：

<script>

$("#exemple").click(function(){
    // load exemple page on click
        $("#response").load("exemple.html");
    });

</script>

为此，您必须在HTML代码中添加id="exemple"

的链接

<a href="#" id="exemple">Click to load the exemple page</a>

希望这能帮到你！