HTML DOM 元素 clientHeight
示例
获取 "myDIV" 的高度和宽度，包括内边距
const element = document.getElementById("myDIV");
let text = "clientHeight: " + element.clientHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px";
自己尝试 »
以下还有更多示例。
描述
<code class="w3-codespan">clientHeight</code> 属性以像素为单位返回元素的可视高度，包括内边距，但不包括边框、滚动条或外边距。
<code class="w3-codespan">clientHeight</code> 属性是只读的。
语法
element.clientHeight
返回值
| 类型 | 描述 |
| 数字 | 元素的可视高度（以像素为单位），包括内边距 |
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";
自己尝试 »
浏览器支持
<code class="w3-codespan">element.clientHeight</code> 在所有浏览器中都受支持
| Chrome | Edge | Firefox | Safari | Opera | IE |
| 是 | 是 | 是 | 是 | 是 | 是 |
