自动调整 iframe 的大小以动态改变高度（更小或更大）

Question

我知道有很多关于调整iframe 大小的帖子，但我发现的只是这段代码：

<script type="text/javascript" language="JavaScript">
<!--            
        function autoResize(id) {
            var newheight;
            var newwidth;

            if (document.getElementById) {
                newheight = document.getElementById(id).contentWindow.document.body.scrollHeight;
                newwidth = document.getElementById(id).contentWindow.document.body.scrollWidth;
            }
            document.getElementById(id).height = (newheight);
            document.getElementById(id).width = (newwidth);
        };
//-->
</script>

这是示例标记代码：

<a href="index.php" target="content">Home</a>
<a href="profile.php" target="content">Profile</a>

<iframe src="index.php" name="content" height="500px" width="100%" id="Main_Content" onload="autoResize('Main_Content');"></iframe>

上面的代码可以正常工作，但我有一个问题。考虑这种情况：

index.php page height is 800px

和

profile.php page height is 1200px

当我单击指向index.php 页面的链接时，iframe 会调整为800px，然后我单击指向profile.php 页面的链接，iframe 会调整为1200px 但这是我的问题，当我再次单击指向index.php 的链接时，该链接的高度小于profile.php 页面，iframe 没有调整大小，也没有调整800px 的高度，这会导致@ 的内容下方有多余的空间987654335@ 看起来不太好，我在增加 iframe 高度时没有问题，但在缩小它时遇到了一些麻烦，有人可以帮我吗？任何帮助表示赞赏。谢谢！

Answer 1

为什么不直接做：

height: auto;
max-height: 1200px;

在 style="" 内的 iframe 本身上或通过 css 文档。

如果高度设置为自动，那么它不需要为 index.php 使用 1200px。但是在显示 profile.php 时，最多允许使用 1200px。

Answer 2

我重现了这个问题。

问题似乎是使用 scrollHeight 和 scrollWidth 有意返回滚动条的当前或所需空间，这不等于文档本身的大小。

当我改变时，问题就消失了

 newheight = document.getElementById(id).contentWindow.document.body.scrollHeight;
 newwidth = document.getElementById(id).contentWindow.document.body.scrollWidth;

进入

 newheight = document.getElementById(id).contentWindow.document.body.style.height;
 newwidth = document.getElementById(id).contentWindow.document.body.style.width;

这对你是否可行，或者这不受你的控制？