如何在纯 javascript 中获取以像素为单位的高度？

Question

我有一个具有以下 HTML 结构的论坛：

<div id="header">Contents</div>
<div id="main">Contents</div>
<div id="footer">Contents</div>

基本上，我需要将 #main 的高度设置为文档的高度减去其他 2 个元素的高度。问题是我必须在没有 jquery 的情况下这样做。我用谷歌搜索了这个问题并找到了 clientHeight 方法，但它 returns 高度作为数字，而我需要它作为像素。

所以，问题是：

Is there any way to get the height in pixels in pure javascript?

Answer 1

属性.clientHeight 将 return 一个数字（以像素为单位的高度）。

对于您的情况，下面是重置 div#main 高度的代码。请注意，我们在末尾添加了一个 "px" 以使 .style.height 起作用：

document.getElementById('main').style.height = parseInt(window.innerHeight) -
document.getElementById('header').clientHeight + 
document.getElementById('footer').clientHeight + "px";

<div id="header">CONTENT</div>
<div id="main">CONTENT</div>
<div id="footer">CONTENT</div>

如何在纯 javascript 中获取以像素为单位的高度？

How to get the height in pixels in pure javascript?

javascript

height

pixel