首页 > 代码库 > 跨域和非跨域 获取iframe页面高度的方法
跨域和非跨域 获取iframe页面高度的方法
跨域方法：
第一步，在主页面里插入代码：
//假设主域名是www.aaa.com 需要插入的跨域域名为www.bbb.com
<iframe src="http://www.bbb.com/index.html" width="100%" height="100%" id="iframepage" name="iframepage" onl oad="iFrameHeight()" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe><script type="text/javascript">function iFrameHeight() {var iObj = parent.parent.document.getElementById(‘iframepage‘);iObjH = parent.parent.frames["iframepage"].frames["MiddleIframe"].location.hash;iObj.style.height = iObjH.split("#")[1] + "px";} </script>
第二步，在跨域页面里（http://www.bbb.com/index.html）插入代码：
//需要在www.aaa.com下新建一个分目录/kuayu下的autoheight.html空文件，否则如果在根目录下建立html文件不确定会不会成功！
<iframe id="MiddleIframe" name="MiddleIframe" src="http://www.aaa.com/kuayu/autoheight.html" width="0" height="0" style="display: none;" onl oad="on_Height()"></iframe><script type="text/javascript">function on_Height(){ hashH = document.documentElement.scrollHeight; urlC = "/kuayu/autoheight.htm"; document.getElementById("MiddleIframe").src=http://www.mamicode.com/urlC+"#"+hashH; }</script>
同域名下方法：
只需一步即可：
<iframe src="http://www.mamicode.com/abc/default.htm" id="iframepage" width="100%" height="100%" onl oad="iFrameHeight()"></iframe><script type="text/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; } }</script>
跨域和非跨域 获取iframe页面高度的方法
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。