javascript - 如何使用 Javascript 删除嵌套框架和 iframe 的滚动条

Question

我正在开发包含不同数量的嵌套框架和 iframe 的 Web 应用程序。当前，当网页呈现浏览器时，浏览器会针对它们呈现滚动条。有时在一个页面中计数为 4-5 个滚动条，看起来非常难看。所以我想通过 Javascript 删除这些滚动条。

要了解此问题，请参阅以下具有 frame/iframe 层次结构的网页示例。

 Frame1
       --Frame2
       --Frame3
              --Frame4
              --Frame5

我的方法: 从根文档开始，搜索页面中的所有框架/iframe，并将这些框架节点放入数组中，并带有名为 level 的附加变量。完成此操作后，我将对数组进行级别排序。所以在这个事件数组之后会是这样的。下面

     0> Frame5 node, level=3
     1> Frame4 node, level=3
     2> Frame3 node, level=2
     3> Frame2 node, level=2
     4> Frame1 node, level=1

在此之后我正在考虑两个选项来删除滚动条

选项#1: 从数组的第 0 个元素开始，获取 frame 的 scrollheight 并将其设置为 Frame 的 height 属性。

var frameScrollHeight=Frame5.contentWindow.document.body.scrollHeight;
Frame5.style.height =frameScrollHeight;

对数组中的每一帧执行相同的过程。我在这里的假设是，如果最里面的框架高度发生变化，其父节点滚动高度必须更改为真正的滚动高度。 例如设置 Frame5 和 Frame4 高度后。当我们获取 Frame3 的滚动高度时，它必须是 Frmae5 高度 + Frame4 高度。但现在它不反射(reflect)真实的滚动高度。我不确定这里出了什么问题。当我们设置 Frame5 和 Frame 4 高度时 Dom 会立即刷新吗？ .我使用了错误的属性吗？因为我还使用脚本调试器(如 clientHeight、offsetHeight)验证了所有其他属性，但没有一个等同于 Frame5 高度 + Frame4 高度。

选项 #2由于上述方法无法正常工作，我采用了另一种方法，即手动添加上一级框架高度并将其设置为下一级的父节点。例如获取 Frame5 和 Frame4 的滚动高度并将其设置为 Frame3 同时添加 Frame3 和 Frame2 的高度并将其设置为 Frame1。

选项二现在可以使用，但它仍然有一些缺点，例如所有框架必须按层次顺序排列并且不能彼此平行。

此外，当我将 scrollheight 设置为 Frame 的高度时，滚动条仍然按原样显示，我必须向 scrollheight 添加一些常量，如 15。所以实际代码就像

var frameScrollHeight=Frame5.contentWindow.document.body.scrollHeight+15;
Frame5.style.height =frameScrollHeight;

我不知道这个 15 是什么。是边框吗？我可以使用 frame 的任何属性得到这个常量吗？

我更喜欢选项 1，但不知道为什么它不起作用。如果有任何其他方法可以解决此问题，请提出建议。

Answer 1

为什么不直接使用

html,body{overflow:hidden}

在 iframe 的 CSS 中？