公司網(wǎng)站后臺原本不是用iframe設計的，后來為了節(jié)約資源，經(jīng)過討論決定把網(wǎng)站后臺改成iframe。iframe可以實現(xiàn)和ajax相似的 局部刷新的效果（他們的實現(xiàn)原理是不同的），iframe雖然很強大，但其不能根據(jù)子頁面的高度自動擴高，這點很惱人啊，于是我在網(wǎng)上搜了搜，找到以下幾種方法，然后進行部分改進了。

一、jquery獲得（注意：此種方法只適合 父類頁面和子類頁面在同一個域名下，并且子類頁面不能包含iframe）

aa.html(父及頁面)

<iframe name="rightcontent"  id="rightcontent" src='bb.html' frameborder="0" width="100%" scrolling="no"></iframe>

$("#rightcontent").load(function(){
       var mainheight = $(this).contents().find("body").height()+30;
       $(this).height(mainheight);
    });

二、用js獲得（網(wǎng)上js獲得的方法很多，隨便一搜就可以找到，但需要注意的是：子類頁面不能包含iframe，如果子類頁面中有ifrme，還是不能實現(xiàn)自動擴高的效果的）

function SetCwinHeight(obj) {
    var cwin = obj;
    if (document.getElementByIdx_x_x_x) {       
      if (cwin && !window.opera) {
            if (cwin.contentDocument && cwin.contentDocument.body.offsetHeight){
               cwin.height = cwin.Document.body.offsetHeight + 30;
               alert(cwin.height); //FF NS
            }else if (cwin.Document && cwin.Document.body.scrollHeight){
                cwin.height = cwin.Document.body.scrollHeight + 10;
            } //IE
        }else {
            this.height=rightcontent.document.body.scrollHeight+30
            if (cwin.contentWindow.document && cwin.contentWindow.document.body.scrollHeight)
                cwin.height = cwin.contentWindow.document.body.scrollHeight; //Opera
        }
    }
}

<iframe name="rightcontent"  id="rightcontent" src='bb.html' frameborder="0" width="100%" scrolling="no" onload="SetCwinHeight(this)">
</iframe>

三、支持子類頁面中 包含iframe，即iframe嵌套使用（火狐和ie測試，其他瀏覽器還沒測試）

 <iframe name="rightcontent"  id="rightcontent" src='bb.html' frameborder="0" width="100%" scrolling="no" onload="this.height=rightcontent.document.body.scrollHeight+50"></iframe>

四、這個是補充的，網(wǎng)站用了方法三，但是發(fā)現(xiàn)如果如果牽扯到跨域名了，方法三不起作用了，是因為我在子頁面中 寫了 <script type="text/javascript">document.domain = 'xxx.com';</script>，這種情況下怎么辦呢，代碼如下：

在子頁面中

<script type="text/javascript">
//設置域信息
document.domain = 'xxx.com';
//設置父級頁面引用自身的iframe高度
function setHeight(){
  //判斷是否為頂級頁面
  if(window.top!=window.self){
      parent.document.getElementByIdx_x('rightcontent').height=document.body.scrollHeight+20
  }
}
setHeight();
</script>

以上就是關(guān)于iframe嵌套 子頁面（含iframe）自動擴高的詳解的詳細內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！