scrollwidth 和 scrollheight 是只读属性,返回元素内容区域总宽高(含 padding、子元素实际尺寸,不含 border/margin),即使无溢出也至少等于 clientwidth/clientheight。

scrollWidth 和 scrollHeight 是元素的只读属性,用于获取元素**内容区域的总宽高**(包括不可见的溢出部分),单位为像素。它们不依赖于是否设置了 overflow: hidden 或是否有滚动条,只要内容实际尺寸超过元素的可视区域(clientWidth/clientHeight),这两个值就会大于可视尺寸。
scrollWidth 和 scrollHeight 的准确含义
它们反映的是元素内部所有内容(含 padding,不含 border、margin)在水平/垂直方向上“实际占据”的总尺寸:
- scrollWidth = 内容实际总宽度(左内边距到右内边距的最远距离)
- scrollHeight = 内容实际总高度(上内边距到下内边距的最远距离)
- 即使内容没溢出(比如内容很短),它们也返回最小可容纳全部内容的尺寸(至少等于
clientWidth/clientHeight) - 它们不包含 border、outline、margin,但包含 padding 和子元素的盒模型贡献
如何正确获取(注意时机和条件)
直接读取即可,但需确保元素已渲染且尺寸稳定:
- 在 DOM 加载完成后再访问:用
DOMContentLoaded或将脚本放在
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











