clientHeight属性返回一个元素的内部高度，不包括边框和滚动条，以像素表示。它可以帮助我们获取元素在页面上占据的空间大小。
HTML DOM clientHeight 属性
HTML DOM clientHeight 是一个属性，它返回一个元素的内部高度，包括内边距，但不包括滚动条，边框和外边距。
clientHeight 属性的值是一个整数，单位是像素（px）。
在 HTML 页面中，clientHeight 属性通常与 JavaScript 一起使用。 通过获取元素的 clientHeight 属性，可以在不影响元素样式或结构的情况下，在 JavaScript 中确定元素的高度。
用法
使用 HTML DOM clientHeight 属性获取元素的高度的步骤如下：
1. 首先，引用您想要获取高度的元素。 这可以通过使用 document.getElementById 方法，或从其他元素属性中访问的元素属性来完成。
例如，下面的代码引用 ID 名为 “example” 的元素：
var element = document.getElementById("example");
2. 接下来，使用 element.clientHeight 来获取元素的高度值。
例如，下面的代码获取元素的高度值：
var height = element.clientHeight;
示例
下面是一个获取元素高度的实际示例，它将获取具有 ID 名称 “example” 的元素的高度，并使用 JavaScript 将其添加到页面上：
<html>
<body>
<div id="example" style="height:100px; border:1px solid black;">这是一个示例文本区域。</div>
<script>
var element = document.getElementById("example");
var height = element.clientHeight;
document.body.innerHTML = "元素的高度是：" + height;
</script>
</body>
</html>
在上面的示例中，当页面加载时，JavaScript 将获取具有 ID 名称 “example”的元素的高度，并将其添加到页面上。
请注意，要正确显示元素高度，您需要在样式中设置高度。 没有指定高度值的元素将不会显示其高度。
浏览器兼容性
HTML DOM clientHeight 属性是跨浏览器兼容的，它支持所有主要的现代浏览器，包括 Chrome、Safari、Mozilla 火狐浏览器、Microsoft Edge 和 Internet Explorer。
结论
HTML DOM clientHeight 是一个用于获取元素高度的方便属性。 它可以帮助您确定不同元素的高度，在网页开发和设计中非常实用。
要使用 HTML DOM clientHeight 属性，请首先引用您想要获取高度的元素，然后使用 element.clientHeight 方法来获取元素的高度值。
最后，请确保在元素的样式中设置了高度值。 在这种情况下，您可以成功地检索元素的高度值，而不影响元素的样式或结构。
