這篇文章，希望在這兩個方面再做一些深入。
可能有人還沒接觸到這個問題過，先說明一下，什麼是高度自適應吧。所謂iframe高度自適應，就是，基於介面美觀和互動的考慮，隱藏了 iframe的border和scrollbar，讓人看不出它是個iframe。如果iframe始終呼叫同乙個固定高度的頁面，我們直接寫死 iframe高度就可以了。而如果iframe要切換頁面，或者被包含頁面要做dom動態操作，這時候，就需要程式去同步iframe高度和被包含頁的實際高度了。
順便說下，iframe在迫不得已的時候才去用，它會給前端開發帶來太多的麻煩。
傳統做法大致有兩個：
方法一，在每個被包含頁在本身內容載入完畢之後，執行js取得本頁面的高度，然後去同步父頁面的iframe高度。
方法二，在主頁面iframe的onload事件中執行js，去取得被包含頁的高度內容，然後去同步高度。
在**維護角度考慮，方法二是優於方法一的，因為方法一，每個被包含頁都要去引入一段相同的**來做這個事情，建立了好多副本。
兩個方法都只處理了靜的東西，就是只在內容載入的時候執行，如果js去操作dom引起的高度變化，都不太方便。
如果在主視窗做乙個interval，不停的來獲取被包含頁的高度，然後做同步，是不是即方便，又解決了js操作dom的問題了呢？答案是肯定的。
demo頁面：主頁面 iframe_a.html ，被包含頁面 iframe_b.htm 和 iframe_c.html
主頁面**示例：
一直執行，效率會不會有問題？
我做了測試，同時開5個視窗（ie6、ie7、ff、opera、safari）執行這個**，不會對cpu有什麼影響，甚至調整到2ms，也沒影響（基本維持在0%佔用率）。
下面談談各瀏覽器的相容性問題，如何獲取到正確的高度，主要是對body.scrollheight和 documentelement.scrollheight兩個值得比較。注意本文用的是這個doctype，不同的doctype應該不會影響結果，但是假如你的頁面沒有申明doctype，那還是先去加乙個吧。
">在主頁面追加以下測試**，以輸出這兩個值，**示例：
check height
被載入頁面，可以切換乙個絕對定位的層，來使頁面高度動態改變。如果層展開，則會撐高頁面高度。**示例：
toggle overlay
下面列出以上**在各瀏覽器的測試值：
（bheight = body.scrollheight, dheight = documentelement.scrollheight, 紅色 = 錯誤值, 綠色 = 正確值）
/ 層隱藏時 層展開時
bheight dheight bheight dheight
ie6 184 184 184 303
ie7 184 184 184 303
ff 184 184 184 303
opera 181 181 300 300
safari 184 184 303 184
暫且無視opera比別人少3畫素的問題…可以看出，如果沒有絕對定位的東西，兩個值是相等的，取哪個都無所謂。
但是如果有，那麼各個瀏覽器的表現不太相同，單取哪個值都不對。但可以找到了一條規律，那就是取兩個值得最大值可以相容各瀏覽器。所以我們的主頁面**就要改造成這樣了：
function reinitiframe()catch (ex){}
}window.setinterval("reinitiframe()", 200);這樣子，基本解決了相容性問題。順便說下，不光絕對定位的層會影響到值，float也會導致兩個值的差異。
如果你演示demo後，會發現，除了ie，其他瀏覽器中，當層展開後再隱藏，取到的高度值還是維持在展開的高度303，而非隱藏回去的真正值 184，就是說長高了之後縮不回去了。這個現象在不同被包含頁面之間做切換也會發生，當從高的頁面切換到矮頁面的時候，取到的高度還是那個高的值。
可以歸納為，當iframe窗體高度高於文件實際高度的時候，高度取的是窗體高度，而當窗體高度低於實際文件高度時，取的是文件實際高度。因此，要想辦法在同步高度之前把高度設定到乙個比實際文件低的值。所以，在iframe的新增 /> 這個值，在實際應用中決定，足夠矮但又不能太矮，否則在ff等瀏覽器裡會有很明顯的閃爍。dom操作的時候主頁面無法監聽到，只能dom操作完了之後把高度變小了。
在我的乙個實際專案中，在成本和收益之間權衡，我並沒有做這個事情，因為每個dom函式中都要插入這個**，代價太高，其實層縮回去不縮掉也不是那麼致命。包括demo裡，也沒有去做這個事情。如果讀者有更好的方法，請告訴我。
這是最終的主頁面的**：
附demo頁面： 主頁面 iframe_a.html ，被包含頁面 iframe_b.htm 和 iframe_c.html
iframe 自適應高度
由於html沒有include或require，做網頁時我們會用iframe來達到包含頁面的目的。如果呼叫的iframe頁面高度會根據內容多少而發生變化，這時通常要保持iframe與內容頁面的高度，以避免出現iframe的滾動條。先搜尋了一下，有不少好的例子，但總覺得說的還不夠明了。下面給出詳細例子...
iframe自適應高度
來自 http ued.koubei.com 2008 05 07 iframe auto fit height 這貼比較長，沒有耐性的朋友請直接拖到帖子末尾的 示例，或者直接去玩我提供的demo。demo頁面 主頁面 iframe a.html 被包含頁面 iframe b.htm 和 ifram...
iframe高度自適應
nl ad this.height document.frames src document.body.scrollheight 例子 1，建立頁面 test.html 頁面中含有乙個 iframe，name為 ifrname id為 ifrid，src 為 iframe.html頁面。2，建立 i...