假设主页面有一个div，里面放置一个iframe 复制代码 代码如下:<div id="frameBox"> <iframe id="frameWin" src="1.html" name="opWin" style="width:100%; height:100% " frameborder="0" scrolling="no"></iframe> </div> 3个菜单链接，分别在iframe加载 1.html、2.html、3.html 三个页面。 3个子页面分别在自己页面加载完window.onload执行 复制代码 代码如下:function aa(){ var newHeight = document.body.scrollHeight + 20 + "px"; window.parent.document.getElementById("frameBox").style.height = newHeight; //以上firefox通过，但是ie6必须加上下面这句，不然iframe高度是改了，但是可见区域没有改 window.parent.document.getElementById("frameWin").style.height = newHeight; } 以下方法只需要把代码放在主页面： 页面代码： 复制代码 代码如下:<div style="border:1px solid #7e99c6" id="frameBox"> <iframe id="frameWin" src="01.html" name="opWin" style="width:100%; height:100% " frameborder="0" scrolling="no" onload="test2()"></iframe> </div> js脚本（加在主页面）： 复制代码 代码如下:function test2(){ var frameWin = document.getElementById("frameWin"); var frameBox = document.getElementById("frameBox"); var newHeight; if (frameWin.Document){ newHeight = frameWin.Document.body.scrollHeight + 20 + "px"; }else{ newHeight = frameWin.contentDocument.body.scrollHeight+ 20 + "px"; } frameWin.style.height = newHeight; frameBox.style.height = newHeight; }

　　推荐阅读

　　javascript 对象定义方法 简单易学

工厂模式: 初级开发者可能会这样定义对象: var obj = new Object(); obj.name = "hero"; obj.showName=function (){alert(this.name);} 这里存在一个问题就是如果我们要在多个地方用obj对象,可能在程序中类似的代码>>>详细阅读

本文标题：javascript 装载iframe子页面，自适应高度

地址：http://www.17bianji.com/kaifa2/JS/28898.html

 1/2    1