How can i find the heights of elements within another element?

Question

ie..

obj = document.getElementById(obj);

var tmpHeight;

len = obj.childNodes.length;

for (i=0; i<len; i++) {

if (obj.childNodes[i].nodeType == 3) {

console.log(obj.childNodes[i].firstChild...

}

}

<div id="4" style="width:100px; height:300px; margin:10px; float:left;">

<h2 id="h2">4</h2>

<p id="p">lorum ipsum and such and such</p>

</div>

only brings me undefined, ive tried many many ways, but no luck so far.

many thanks :)

Answer 1

There&#039;s a much easier way. If you don&#039;t use Firefox, download and install it. Then, download and install the Web Developer add-on. The tool sits in a toolbar above the content window/tabs and can provide all kinds of information about various elements on a page.

I couldn&#039;t work without it.

Answer 2

I can&#039;t see what property you&#039;re using to assay the heights, but, if it&#039;s {element}.style.height, try using {element}.offsetHeight instead. The value will have no units explicitly reported but will be measured in pixels.