如何在javascript中找到div的大小？

i am trying to figure this out:

i have some html and php:

<div class="main" style="height: 800px">
    <div class="head" style="height: 300px"</div>
    <div class="container">
        <?php
        for ($i=0; $i<=$size;$i++){
            echo "<div style="/"height: 20px;/">line $i</div>";
        }
        ?>
     </div>
</div>

now, what i am trying to do is to find the height of the .container div and apply it to $size

if the .container height is 100 then i will do something like: $size = 100 / 20 or something similar.

The issue is that even if i find the div height it is still on the client side and i might have to do some ajax.

Another problem is that if there is no content in the .container usually there is no height.

in this case i could force the size of .container to be 800 - 300 but i don't allays know other sizes from different block elements on the page.

i hope i am not to confuse with this question.

any ideas?

Thanks

Description

You can use jQuery's height() and width() method to get the size.

Check out the sample and jsFiddle Demonstration

Sample

html

<div class="container">
    MyContent<br><br>
</div>

jQuery

alert($(".container").height())
alert($(".container").width())

More Information