iframe框架自适应

父页面的html结构

<iframe id="mainFrame" src="" onload="iframeLoad()"></iframe>

父页面的js方法

function iframeLoad() { //框架自适应JS onload="iframeLoad()"
        document.getElementById("mainFrame").height=0;
        document.getElementById("mainFrame").height=document.getElementById("mainFrame").contentWindow.document.body.scrollHeight;
    }

该方法自动获取子页面实际页面高度,并将外层的iframe设置成相应高度

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • h5常见的面试题
    第一部分 HTML&CSS整理答案 1. 什么是HTML5？ 答：HTML5是最新的HTML标准。 注意：讲述HT...
    kismetajun阅读 27,626评论 1赞 45
  • HTML <iframe>和<frame>标签
    元素会创建包含另外一个文档的内联框架（即行内框架）； 一、align 属性（不赞成） align属性规定ifram...
    puxiaotaoc阅读 19,764评论 0赞 14
  • 面试问题答案综合版(web)
    $HTML， HTTP，web综合问题 1、前端需要注意哪些SEO 2、 的title和alt有什么区别 3、HT...
    Hebborn_hb阅读 4,651评论 0赞 20
  • iframe高度自适应的6个方法
    自适应高度，其实就是设置iframe的高度，使其等于内嵌网页的高度，从而看不出来滚动条和嵌套痕迹。对于用户体验和网...
    布拉德皮蛋_qzy阅读 3,373评论 0赞 3
  • 面试题
    前端开发面试题 面试题目： 根据你的等级和职位的变化，入门级到专家级，广度和深度都会有所增加。 题目类型： 理论知...
    怡宝丶阅读 2,606评论 0赞 7