如何使iframe僅捕獲一個網頁的一個元素？

Question

我試圖從我的網站www.RichBlocksPoorBlocks.com中捕獲div#map-canvas，以製作一個可嵌入任何地方的iframe。

這裏是我的iframe

<iframe src="http://www.richblockspoorblocks.com#map-canvas" style="width:600px; height:400px;"></iframe> 

它去div#map-canvas，而且還加載了頁面的其餘部分爲好。我想這個div是iframe中唯一的東西。

這可能與iframe？

Answer 1

當您撥打http://www.richblockspoorblocks.com#map-canvas時，散列可能會導致瀏覽器尋找對應的<a name="foo">bar</a>，所以這將無法使用iFrame。

我會推薦做的是寫一個腳本，你從你的iFrame調用接受頁面片段的名稱加載。我知道使用jQuery的$.load()你可以調用一個元素ID來加載一個頁面片段，我認爲它也可以在PHP中使用...

Answer 2

要實現這一點，創建單獨的.php或.html文件其中只包含要在iframe中顯示的部分並排除其他所有內容的文檔。

因此，而不是指向「http://www.richblockspoorblocks.com#map-canvas」的iframe，它會指向類似於：「http://www.richblockspoorblocks.com/map-canvas.php」。

這將是一個非常快速有效的做你想做的方式，並且不需要任何外部庫或JavaScript。

Answer 3

你不能在iframe中使用散列鏈接。

您可以並且應該使用您喜歡的服務器端語言的幾行來創建要渲染的特定內容，然後鏈接到它。這樣，你的服務器將只發送給最終用戶所需的數據，並且還可以節省帶寬和加載時間。