HTML DOM 元素 clientHeight
示例
获取“myDIV”的高度和宽度,包括内边距
const element = document.getElementById("myDIV");
let text = "clientHeight: " + element.clientHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px";
自己动手试一试 »
更多示例见下文。
描述
clientHeight
属性返回元素的可见高度(以像素为单位),包括内边距,但不包括边框、滚动条或外边距。
clientHeight
属性是只读的。
语法
element.clientHeight
返回值
类型 | 描述 |
Number | 元素的可见高度(以像素为单位),包括内边距 |
clientHeight/clientWidth 和 offsetHeight/offsetWidth 的区别
没有滚动条时
const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";
自己动手试一试 »
有滚动条时
const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";
自己动手试一试 »
浏览器支持
element.clientHeight
在所有浏览器中都受支持
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 是 |