Get div height with plain JavaScript
var clientHeight = document.getElementById('myDiv').clientHeight;
or
var offsetHeight = document.getElementById('myDiv').offsetHeight;
clientHeight
includes padding.
offsetHeight
includes padding, scrollBar and borders.
jsFiddle
var element = document.getElementById('element');
alert(element.offsetHeight);
Another option is to use the getBoundingClientRect function. Please note that getBoundingClientRect will return an empty rect if the element's display is 'none'.
Example:
var elem = document.getElementById("myDiv");
if(elem) {
var rect = elem.getBoundingClientRect();
console.log("height: " + rect.height);
}
UPDATE: Here is the same code written in 2020:
const elem = document.querySelector("#myDiv");
if(elem) {
const rect = elem.getBoundingClientRect();
console.log(`height: ${rect.height}`);
}