装载iframe 子页面，自适应高度

最新推荐文章于 2024-08-28 14:23:26 发布

iteye_1458

最新推荐文章于 2024-08-28 14:23:26 发布

阅读量69

点赞数

分类专栏： HTML 文章标签： HTML

本文链接：https://blog.csdn.net/iteye_1458/article/details/81687061

版权

HTML 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

[b]aa.html[/b]


<html>
<head>
    <title></title>
</head>
<body>
<p class="aaClass" id="aa" style="height:300px; border:1px solid black;">aa.html</p>
</body>
</html>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>

<div style="border:1px solid #7e99c6" id="frameBox">
    <iframe id="frameWin" src="aa.html" name="opWin" style="width:100%; height:100% " frameborder="0" scrolling="no"
            onload="test2()"></iframe>
</div>


<script type="text/javascript">
    function test2() {
        var frameWin = document.getElementById("frameWin");
        var frameBox = document.getElementById("frameBox");
        var newHeight;
        if (frameWin.Document) {
            newHeight = frameWin.Document.body.scrollHeight + 20 + "px";
        } else {
            newHeight = frameWin.contentDocument.body.scrollHeight + 20 + "px";
        }
        frameWin.style.height = newHeight;
        frameBox.style.height = newHeight;
    }

</script>

</body>
</html>