关于iframe高度的自适应

这两天在帮朋友做一个站，因为页面中除了中间的内容不同，头部导航和底部内容都是一样的，所以我考虑用iframe来嵌入中间的内容，通过点击导航上的链接来改变其页面。

由于中间内容高度不一定，所以涉及到自动调整iframe高的问题。用document.body.scrollHeight可以取得本页面内容高，然后通过JS来改变iframe的高：

window.parent.document.getElementsByTagName('iframe')[0].style.height = document.body.scrollHeight

但是在IE中正常的代码，在FF中iframe的高不会变化，同时document.body.scrollHeight取得的值也比IE中的小。

后来经过多次实验我发现，FF中，长度属性要加单位，另外，由于我用Div+CSS来布局，有的容器没有写上高度，造成取得的页面内容高度偏低。知道了原因，解决起问题就快多了。

最终代码如下：

function   changeIframeHeight()  //自动改变 Iframe 的高度，加在Iframe页面的Onload
  {
 if (top != self)
  try
  {
   var h = document.body.scrollHeight;
   if(document.all) {h += 4;}
   if(window.opera) {h += 1;}
   var hpx = h+'px';
   window.parent.document.getElementsByTagName('iframe')[0].style.height = hpx;//我的页面中只一个嵌入
     }
  catch(e)
  {alert("脚本无法跨域操作！");}
  }

另外，由于我是用Div+CSS来布局的，所以要在iframe标签中加入以下代码，以防在FF中由于父标签的高不够而造成部分内容无法显示：
<div id="Content"><iframe src="profile.html" id="mainFrame" name="mainFrame" width="1000" frameborder="0" scrolling="auto" height="440" onload="changp(this);"></iframe></div>

changp()函数如下：

function changp(c){
 c.parentNode.style.height=c.style.height;
}