使用div來創建類似於iframe的東西

最近我的編程類出現了一個問題，即是否可以創建類似於iframe的東西，但只使用div和javascript/css。老師說這是可能的，但由於我是新手，所以我對編寫這樣的代碼感到不知所措。有沒有人有一個快速的例子來說明如何做到這一點？使用div來創建類似於iframe的東西

來源

2013-07-13 user2578330

'相似'以什麼方式？ –

你可以使用'overflow：scroll'來模擬div中的滾動條，但這就是我所知道的全部！ – Zhanger

也許你可以使用AJAX加載div內的另一個頁面。 – furas

最有可能你的導師是像

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

或者

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

這兩者考慮使用一些可用於生產固定大小的分度，滾動條溢出。您甚至可以使用AJAX從另一個頁面加載內容並將其插入div。然而，與iframe不同，它們不能用於顯示來自另一個域的內容（除非它允許CORS）。

來源

2013-07-13 02:48:05 AlliterativeAlice

您是如何推斷出提問者詢問模擬「iframe」的物理屬性（例如滾動條而不是其他功能屬性）的？可以有'iframe'沒有滾動條ಠ_ಠ – hyde

由於使用div充分複製iframe的功能是不可能的，我會假設他們的教師會知道這一點。滾動/自動溢出離div可以獲得的iframe最近。 – AlliterativeAlice

對於部分支持，您可以使用AJAX獲取另一個HTML頁面的主體，並將目標div的'innerHTML'設置爲此。對於某些完全支持，您可以將腳本和樣式表注入當前頁面的頭部。 – hyde

我會說這是可能的，iframe本質上是從另一個位置嵌入內容資源，不管它在本地域或外部域。複製這可能是容易或困難的請求類型你想要做一個簡單的方法使用jQuery會是這樣的事情是這樣的 $ .ajax（{url：urlToResource，success：function（data）{ $ （'.contentDiv'）。html（data）; }）;

<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等相當過時。

來源

2013-07-13 03:02:10 ninjr

HTML5包含iframe，事實上，它已經*增強了它們。當然，在所有情況下，它們可能都沒有用處，但他們非常優秀的一件事就是沙盒。 – icktoofay

即時通訊並不是說他們不屬於任何地方，但他們可以是一個麻煩可以實施一個簡單的工作。 – ninjr

如果您正在討論的是在沒有使用iframe，您可以使用AJAX從另一個頁面或甚至服務中加載內容並將其呈現爲div。見this explanation and demo on CSS-Tricks。

來源

2013-07-13 03:44:51 MoonKat1216

使用div來創建類似於iframe的東西

回答

相關問題