将网页插入Div而不是iframe

Insert Webpages into Div instead of iframe?

本文关键字：iframe Div 网页 插入      更新时间：2023-09-26

这是我的loop.html文件的全部代码。它首先从同一目录中的一个单独的XML文件中提取url列表，然后在指定的时间内循环遍历它们。时间元素是它将等待的时间，直到它循环到下一页。我想做的是使用DIV在URL中循环，因为不是所有浏览器都支持iframe，并且在运行html脚本时不会显示一些内容。我不确定的是如何处理"dashboard.url"——当我想使用div时？

我在另一个网站上找到了这段代码——当你用它替换frams['theDisplay']行时，它会将div设置为网页——但我想使用dashboard.url 获得这样的代码

$("#siteloader").html('<object data="http://latimes.com" />');

如果这是一个很长的问题，如果你感到沮丧，我很抱歉。我只是想边走边学。非常感谢。

list.xml格式示例：

<list>
<url>
<link>http:latimes.com</link>
<time>2</time>
</url>
<url>
<link>http:stackoverflow.com</link>
<time>4</time>
</url>
</list>

整个HTML代码：

<!DOCTYPE HTML>
<!--Created by Megan Chiu  - 30 June 2013-->
<html>
<!-- CSS -->
<style type="text/css">
displayArea {
    margin: 0;
    width: 100%;
}
html, body {
    height: 100%
    width: 100%;
}
div {
    height: 100%;
    width: 100%
}
object {
    width: 100%;
    min-height: 100%;
}       
</style>  
<head>
    <meta charset="UTF-8">
    <style type="text/css">
    body, html { margin: 0; padding: 0; width: 100%; height: 100%;
                 overflow: hidden; }
    iframe { border: none; }
</style>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"
    type="text/javascript"></script>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    var Dash = {
        nextIndex: 0,
        dashboards: [],
        loadXML: function() {
            $.ajax( {
                type: "GET",
                url: "list.xml", 
                dataType: "xml",
                success: Dash.renderXML
            });
        },
        renderXML: function(xml) {
            $(xml).find("url").each(function() {
                var _link = $(this).find('link').text();
                var _time  = $(this).find('time').text();
                Dash.dashboards.push({url:_link, time:_time});
            }); 
            Dash.display();
            },
        display: function()
        {
            var dashboard = Dash.dashboards[Dash.nextIndex];    
            frames['theDisplay'].location.href = dashboard.url;
            Dash.nextIndex = (Dash.nextIndex + 1) % Dash.dashboards.length;
            setTimeout(Dash.display, dashboard.time * 1000);
        }    
    };
    window.onload = Dash.loadXML;
</script>
</head>
<body>
</body>
<iframe id="theDisplay" width="100%" height="100%"></iframe>
</html>

  <div id="content1"></div>
<script>
document.getElementById("content1").innerHTML='<object type="text/html" data="header.php" ></object>';
alert('Load_Ok');
</script>

您不能仅使用纯JavaScript从其他网站加载内容。时期

http://en.wikipedia.org/wiki/Same_origin_policy

那么你能做什么呢？您可以从服务器发出web请求，从远程服务器获得Http响应，并将它们放入div元素中。

<div><%=(new WebClient()).DownloadString("http://www.stackoverflow.com")%></div>

但最大的问题之一是，由于您将从远程网站下载所有样式和脚本，所以您的页面可能看起来不太好。甚至连人类可读性都没有。若你们继续从同一个IP访问这些服务器，你们可能会被它们阻止。

祝你好运。

相关文章：