将网页插入Div而不是iframe?

时间:2013-07-23 16:34:31

标签: javascript jquery html iframe

这是我的loop.html文件的完整代码。它首先从位于同一目录中的单独XML文件中提取URL列表,然后在指定时间内循环遍历它们。时间元素是它将循环到下一页的等待量。我想要做的是使用DIV循环访问URL,因为所有浏览器都不支持iframe,并且在运行html脚本时不显示某些内容。我不确定的是如何处理“dashboard.url” - 当我想使用div时?

我从另一个网站发现了这段代码 - 当你用frams ['theDisplay']替换它时,它会将div设置为一个网页 - 但是我希望有这样的东西,使用仪表板.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>

2 个答案:

答案 0 :(得分:0)

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

答案 1 :(得分:-2)

您无法使用纯JavaScript从其他网站加载内容。期。

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

那你可以做什么?您可以从服务器发出Web请求并从远程服务器获取Http响应并将它们放入div元素。

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

但最大的问题之一是,由于您将从远程网站下载所有样式和脚本,因此您的页面可能看起来不太好。甚至不是人类可读的。如果你将继续从相同的IP到这些服务器,你可能会被它们阻止。

祝你好运。