html+iframe+跟随高度,html iframe高度自适应

想到的一种办法是，在父页面里获取子页面的高度，在父页面onlod里把获取到子页面的高度赋值给父页面iframe标签，不过这种方法感觉不是很好，因为浏览器兼容性不好，获取不到高度

这种方法有两种写法

function calcPageHeight(doc) {

var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)

var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)

var height  = Math.max(cHeight, sHeight)      return height

}  var ifr = document.getElementById('ifr')

ifr.onload = function() {      var iDoc = ifr.contentDocument || ifr.document

var height = calcPageHeight(iDoc)

ifr.style.height = height + 'px'

}

function calcPageHeight(doc) {

var cHeight = Math.max(doc.body.clientHeight, doc.documentElement.clientHeight)

var sHeight = Math.max(doc.body.scrollHeight, doc.documentElement.scrollHeight)

var height  = Math.max(cHeight, sHeight)        return height

}

window.onload = function() {

var height = calcPageHeight(document)

parent.document.getElementById('ifr').style.height = height + 'px'

}

还有一种是兼容性比较好的Javascript代码：

function iFrameHeight() {

var ifm= document.getElementById("iframepage");

var subWeb = document.frames ? document.frames["iframepage"].document : ifm.contentDocument;

if(ifm != null && subWeb != null) {

ifm.height = subWeb.body.scrollHeight;

}

}

原文链接：https://www.cnblogs.com/zxf100/p/10322564.html