iframe根据内容的高度和宽度自适应显示

建站过程中经常会使用iframe标签去调用一些图片、视频或者网页内容，对于调用内容的宽度和高度，我们常用width和height属性去设置。但是不同的浏览器对于宽高的要求是不一样的。如果我们把宽高写死，那么可能会在一些浏览器中出现错位的情况。所以就要想办法来设置iframe调用内容的宽高自适应浏览器。

百度搜索了好久，找了很多方法和代码都没有作用，最终在简书看到一篇文章介绍iframe根据内容的高度和宽度自适应显示的代码，测试后好像确实可以自适应。

所以扒下来留存，以便于后期使用。代码如下：

<iframe src="https://www.baidu.com" id="iframe" frameborder="0" scrolling="no" onload="changeFrameHeight()"></iframe>
        <script type="text/javascript" language="javascript">
            function changeFrameHeight() {
                var ifm = document.getElementById("iframe");
                ifm.height = document.documentElement.clientHeight;
                ifm.width = document.documentElement.clientWidth;
                console.log("高度",document.documentElement.clientHeight);
            }
            window.onresize = function() {
                changeFrameHeight();
            }        </script>