iframe 自适应高度,无限级父框架

问题描述 
    今天在处理一个Iframe自适应高度时遇到一个多层Iframe引用时的高度不能撑开的问题，效果同Demo1. 


原因分析 
    问题是由引用的顺序引起的，我们假设有3层Iframe引用，h1.html,h2.html,h3.html  h1包含h2,h2又包含h3,h3.html中有内容会出现高度适应问题，一般的处理方式是我们在引用h3的iframe中加入onload事件来让这个Iframe高度自适应引用的页面高度。这时我们打开h1.html就开发页面看起还是没有撑开，这是因为页面是一级一级的加载下去的，当h1引用h2 时，h2的高度是固定的，当h3加载完毕的时候h2的高度做了变化，但是这时h1的引用页面高度并没有改变就造成了页面看起来还是没有撑开，经和同事讨论后编写了一个JS的自动重新计算parent(父页面)中Iframe元素的高度，从而解决这个问题，原理主要是通过一直循环获取页面parent的 Iframe元素，当获取到top层时就结束

 

单个iframe适应

onload = " this.style.height=iframe1.document.body.scrollHeight "

注：iframe1为该框架的ID，我在尝试不硬写名字的自适应方法，如果成功就换上来。

 

自适应多级iframe高度

// 进行Iframe的自动撑开,让所有父页面的Iframe都自动适应包含页高度
function autoHeight(){
var doc = document,
p = window;
while (p = p.parent){
var frames = p.frames,
frame,
i = 0 ;
while (frame = frames[i ++ ]){
if (frame.document == doc){
frame.frameElement.style.height = doc.body.scrollHeight;
doc = p.document;
break ;
}
}
if (p == top){
break ;
}
}
}

 

 

 

 

 

某网友评论：

帖一個我們之前用的方法吧,比較好用:

var getFFVersion = navigator.userAgent.substring(navigator.userAgent.indexOf( " Firefox " )).split( " / " )[ 1 ]
var FFextraHeight = getFFVersion >= 0.1 ? 16 : 0
function dyniframesize(iframename) {
var pTar = null ;
if (document.getElementById){
pTar = parent.document.getElementById(iframename);
}
else {
eval( ' pTar = ' + iframename + ' ; ' );
}
if (pTar && ! window.opera){
if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight){
pTar.style.height = pTar.contentDocument.body.offsetHeight + FFextraHeight + 25 ;
}
else if (pTar.Document && pTar.Document.body.scrollHeight){
pTar.style.height = pTar.Document.body.scrollHeight;
}
}
}