Question

我正在尝试在div.On内部加载一个外部页面，点击一个div我希望另一个网页加载到另一个div中。但是网页没有加载到第二个div上。这是小提琴。< / p>

https://jsfiddle.net/user1989/xpp5t6nv/9/

<div id="fileTreeDemo_1" class="demo" onclick="alert1()">abc</div> <div id="upload_target" name="upload_target" ></div>

<style>
html,body{
    height:100%;
    width:100%;
}
body{
    margin: 0 0 0 0;
    padding:0 0 0 0;

}
div{
    box-sizing: border-box;-moz-box-sizing: border-box;
    height:100%;
    display: inline-block;
}
body > div:first-child{
    width:20%;
    border:solid 2px green;
}
body > div:nth-child(2){
    width:80%;
    border:solid 2px blue;
    float:right;
}

function alert1(){

document.getElementById("upload_target").innerHTML='<object type="text/html" data="https://www.google.co.in" ></object>';

}
alert1()

Answer 1

试试这个。

function load_home() {
  document.getElementById("content").innerHTML = '<object type="type/html" data="home.html" ></object>';
}

<div id="topBar"> <a href="#" onclick="load_home()"> HOME </a> 
</div>
<div id="content"></div>

Answer 2

这是“跨源资源共享”（除非您的页面位于google.co.in域内）。长篇故事： https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

您的代码将在您自己的域中使用Url。大多数网站都不允许这样做。浏览器的容忍程度各不相同。如果目标在您的控件中，您可以将以下内容添加到目标页面的标题中以允许它 -

Access-Control-Allow-Origin: *

有关详情，请参阅此处。 http://enable-cors.org/server.html

如果没有，您可以使用php，node.js或asp代理外部页面服务器端，然后点击代理页面查找对象的数据。但这是一个完全不同的主题。

外部html页面没有在div内加载

2 个答案: