How to take div height from javascript when div element height is auto

Many times we need to get the div or any DOM elements height and width when these properties not defined.

Lets say I kept div height auto and width as 200px fix and data is dynamic for eash user. So how we can get the div height.

We can use two javascript functions for fetching the div height.
1. offsetHeight – this will return the value which are specified in your CSS

2. clientHeight – this function will return real inner height of element that does not matter about CSS.
I recomend to use this function.

Exmaple code as follows:

<style>
#wordpressapidiv{ width:200px; height:auto;border:#ccc 1px solid}
</style>
<div id=\"\wordpressapidiv">
This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content.
This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content.

This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content. This is dummy content.
This is dummy content. This is dummy content.
</div>

<script>
function getDivHeight(divID){
gd = document.getElementById(divID).clientHeight;
alert(gd);
}

function getDivWidth(divID){
gw = document.getElementById(divID).clientWidth;
alert(gw);
}

</script>

<input name="test" type="button" onclick="getDivHeight('wordpressapidiv')" >

Function above code you can fetch the div height and width using the javascript.

You may like following Articles!