iframe高度自适应页面的高度

最新推荐文章于 2021-08-09 15:00:38 发布

翻译最新推荐文章于 2021-08-09 15:00:38 发布 · 867 阅读

文章标签：

#iframe #前端

本文介绍了一种使用JavaScript实现iframe自适应高度的方法。通过监听iframe加载完成事件，并获取内部文档的高度来动态调整iframe的高度。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div class="tpl-content-wrapper">
    <iframe id="frameId" frameborder="0" scrolling="no" height="auto" src=""  onLoad="iFrameHeight()"></iframe>
</div>

<script type="text/javascript" language="javascript">
    function iFrameHeight() {
        var ifm= document.getElementById("frameId");
        var subWeb = document.frames ? document.frames["frameId"].document :
            ifm.contentDocument;
        if(ifm != null && subWeb != null) {
            ifm.height = subWeb.body.scrollHeight;
        }
    }
</script>