Incorrect height of div returned by JS

Question

var div = document.getElementById('foo');
console.log(div);
console.log(div.scrollHeight);

When I click on the DOM of div returned by the first log in the console, its scrollHeight is x, while the second log prints out y; x != y.

Answer 1

To get height of a div try-

1. JavaScript:

var clientHeight = document.getElementById('divId').clientHeight;

or

var offsetHeight = document.getElementById('divId').offsetHeight;

2. jQuery:

var height= $("#divId").height();

3. vanilla JS:

var clientHeight =  document.querySelector('#divId').clientHeight;

or

var offsetHeight = document.querySelector('#divId').offsetHeight;