iframe自身高度的问题

最新推荐文章于 2022-03-18 16:03:42 发布

原创最新推荐文章于 2022-03-18 16:03:42 发布 · 341 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种通过JavaScript实现iframe自适应高度的方法。该方法利用定时器不断调整iframe的高度，以确保其内容能够完全展示且不会出现多余的空间。这种方法适用于需要内嵌其他页面并保持美观布局的场景。

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

<div class="content_index" >
    <iframe  src="../html/home_details.html"  frameborder="0" scrolling="auto" id="test" width="100%" onload="this.height=100" ></iframe>

</div>

function reinitIframe() {
    var iframe = document.getElementById("test");
        try {
            var bHeight = iframe.contentWindow.document.body.scrollHeight;
            var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;
            var height = Math.max(bHeight, dHeight);
            iframe.height = height;
            console.log(height);
        } catch (ex) {
    }
}
window.setInterval("reinitIframe()", 200);