Find out the height of an element through Javascript, if it is written in a style file

Question:

How can I get the height attribute of an element via Javascript if it is written in the style.css file?

style.css:

.menu_bottom {
    height: 100px;
}

index.php:

<div id="menu_bottom" class="menu_bottom">
    <script type="text/Javascript">
        alert(document.getElementById("menu_bottom").style.height);
    </script>

You want the alert(...) message to show the height of the given element (just a number, no unit).

Answer:

the easiest is to use jQuery :

$('#menu_bottom').height();

without jQuery you can use:

var h = document.getElementById('menu_bottom').clientHeight;
var h = document.getElementById('menu_bottom').offsetHeight;
var h = document.getElementById('menu_bottom').scrollHeight;

clientHeight is the height of the content along with the padding, but no scrollbar.

offsetHeight is the "outer" height of the box, including borders.

scrollHeight is the full inner height, including the scrolled area.