iframe自适应及offsetHeight/Width+scrollHeight/Width区别

offsetHeight, offsetWidth:返回元素的高度和宽度，以像素为单位。scrollHeight, scrollWidth:返回元素的完整的高度和宽度，以像素为单位。当一个元素拥有滚动条时（比如由于CSS的 overflow 属性），这些属性和offsetHeight与offsetWidth不同，offsetHeight 和 offsetWidth 只是报告元素的可见部分的大小。 参考：http://www.w3school.com.cn/xmldom/dom_htmlelement.asp

<! DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
< html >
< head >
< title > iframe </ title >
< meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" >
< meta http-equiv ="Content-Style-Type" content ="text/css" >
< script type ="text/javascript" >
// iframe高度自适应
function IFrameReSize(iframename) {
　　 var pTar = document.getElementById(iframename);
　　 if (pTar) { // ff
　　 if (pTar.contentDocument && pTar.contentDocument.body.offsetHeight) {
　　 pTar.height = pTar.contentDocument.body.offsetHeight;
　　 } else if (pTar.Document && pTar.Document.body.scrollHeight) { // ie
　　 pTar.height = pTar.Document.body.scrollHeight;
　　 }
　　 }
　　 }
　　 // iframe宽度自适应
　　 function IFrameReSizeWidth(iframename) {
　　 var pTar = document.getElementById(iframename);
　　 if (pTar){ // ff
　　 if (pTar.contentDocument && pTar.contentDocument.body.offsetWidth) {
　　 pTar.width = pTar.contentDocument.body.offsetWidth;
　　 } else if (pTar.Document && pTar.Document.body.scrollWidth){ // ie
　　 pTar.width = pTar.Document.body.scrollWidth;
　　 }
　　 }
　　}
</ script >
</ head >
< body >
< iframe src ="includ.html" scrolling ="no" frameborder ="1" height ="100%" id ="mainFrame" width ="100%" onload ='IFrameReSize("mainFrame");IFrameReSizeWidth("mainFrame");' ></ iframe >
</ body >
</ html >

转载于:https://www.cnblogs.com/wen12128/archive/2011/04/05/2005535.html