调整 iframe 的大小以适应其内容

紫微前端

于 2022-07-26 09:26:28 发布

阅读量882

点赞数

CC 4.0 BY-SA版权

分类专栏：常用代码片段文章标签：前端 javascript html

本文链接：https://blog.csdn.net/liuhao9999/article/details/125987873

常用代码片段专栏收录该内容

168 篇文章 ¥39.90 ¥99.00

订阅专栏

本文探讨如何利用 JavaScript 和 HTML 特性，使 iframe 的尺寸动态调整以完美适应其内部内容的高度和宽度，实现无缝的用户体验。

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

frame.addEventListener('load', function () {
    // Get the height of the content
    const height = frame.contentDocument.body.scrollHeight;

    // Set the height of iframe
    frame.setAttribute('height', `${height}px`);
});