Question

最近在我的编程课中提出了一个问题，即是否可以创建类似于iframe但只使用div和javascript / css的东西。导师说这是可能的，但由于我对整个编程工作都很陌生，所以我对如何编写这样的代码感到茫然。有没有人有一个快速的例子来说明如何做到这一点？

Answer 1

如果您正在谈论在不使用iframe的情况下在页面中显示外部内容，您可以使用AJAX从其他页面甚至从服务加载内容并将其呈现为div。请参阅this explanation and demo on CSS-Tricks。

Answer 2

很可能你的导师正在考虑使用像

这样的东西

<div style="width:500px;height:500px;overflow:scroll;"></div>

或者

<div style="width:500px;height:500px;overflow:auto;"></div>

这两个都可用于生成带滚动条溢出的固定大小的div。您甚至可以使用AJAX从其他页面加载内容并将其插入到div中。但是，与iframe不同，它们不能用于显示来自其他域的内容（除非它允许使用CORS。）

Answer 3

我想说这是可能的，iframe本质上是嵌入来自其他位置的内容资源，无论是在本地域还是外部域。复制这个可能很容易或很难在你想要使用jquery做一个简单方法的请求类型中有这样的东西 $ .ajax（{url：urlToResource，success：function（data）{ $（ 'contentDiv'）HTML（数据）。 }）;

<style type="text/css">
.contentDiv {
 overflow:auto;
 width:200px;
 height:200px;
}
</style>

<div class="contentDiv"></div>

同样，这完全取决于什么类型的资源以及远程域是否有一个ajax块，而另一种方法可以通过一个简单的php文件绕过它;

<?php

  print file_get_contents("http:://pathToResource.com");

?>

这应该足以开始调查自己了。但是，作为一个提示试图避免使用iFrames，它们比它们的价值更麻烦，并且在html5等当前技术方面相当陈旧。

使用div来创建类似于iframe的东西

3 个答案: