HTML DOM 元素 offsetHeight
示例
显示 "myDIV" 的高度和宽度，包括内边距和边框
const elmnt = document.getElementById("myDIV");
let text = "带有内边距和边框的高度: " + elmnt.offsetHeight + "px<br>";
text += "带有内边距和边框的宽度: " + elmnt.offsetWidth + "px";
尝试一下 »
更多示例如下。
描述
The offsetHeight 属性返回元素的可视高度（以像素为单位），包括内边距、边框和滚动条，但不包括边距。
The offsetHeight 属性是只读的。
教程
offsetParent
所有块级元素相对于 offsetParent 报告偏移量
- offsetTop
- offsetLeft
- offsetWidth
- offsetHeight
offsetParent 是具有非 static 位置的最近祖先。
如果不存在 offsetParent，则偏移量相对于文档主体。
另请参阅
语法
element.offsetHeight
返回值
| 类型 | 描述 |
| 数字 | 元素的可视高度（以像素为单位），包括内边距、边框和滚动条。 |
clientHeight/clientWidth 和 offsetHeight/offsetWidth 之间的区别
没有滚动条
const elmnt = document.getElementById("myDIV");
let text = "";
text += "带有内边距的高度: " + elmnt.clientHeight + "px<br>";
text += "带有内边距和边框的高度: " + elmnt.offsetHeight + "px<br>";
text += "带有内边距的宽度: " + elmnt.clientWidth + "px<br>";
text += "带有内边距和边框的宽度: " + elmnt.offsetWidth + "px";
尝试一下 »
带有滚动条
const elmnt = document.getElementById("myDIV");
let text = "";
text += "带有内边距的高度: " + elmnt.clientHeight + "px<br>";
text += "带有内边距、边框和滚动条的高度: " + elmnt.offsetHeight + "px<br>";
text += "带有内边距的宽度: " + elmnt.clientWidth + "px<br>";
text += "带有内边距、边框和滚动条的宽度: " + elmnt.offsetWidth + "px";
尝试一下 »
浏览器支持
element.offsetHeight 在所有浏览器中都支持
| Chrome | Edge | Firefox | Safari | Opera | IE |
| 是 | 是 | 是 | 是 | 是 | 是 |
