jquery或者javascript 获取div高度的问题

我现在做一个在线聊天的简单功能，用div显示内容。
滚动条每次都在最下面。
当显示的内容为文字时候，滚动条的位置是正确的。
当显示的内容包含图片的时候，滚动条总是停留在中间位置。
请问如何才能正确获取div的高度呢。<html>
<style type="text/css">

div{line-height:20px;
font-size:14px; }
 #msg{
        overflow:scroll;   
        padding:3px;        
        width:expression(document.body.clientWidth);
        background-color:#ffffff;
        border:1px inset white;
        BORDER-BOTTOM: 2px inset red;"
    }
    #msg div{      
        line-height:20px;
    }
div img { 
max-width:600px; 
width:600px; 
width:expression(document.body.clientWidth>600?"600px":"auto"); 
overflow:hidden; 
}</style>
<BODY onLoad="loadok();">

<table id="contentTB" class=layout cellpadding=0 cellspacing=0 width=100% onDblClick="">
<tr   style="height:22px;background-image: url(../image/panel_title.jpg);"  onDblClick="max();showOrHidden();">
<td >
<b>资讯 </b>
</td>
</tr>

<!-- B.业务数据区：列表 -->
<tr><td colspan=3>

<div id="msg"></div>
 

</td></tr>
<!-- C.业务数据区：列表翻页控制 -->
<tr style="height:65px;" id="sendTR" >
<td colspan=3>
<form name="chatform" >
<table width=100% >
<tr><td>
<textarea name="content" cols=52 rows=5 style="overflow:auto" style="width:100%"></textarea>
</td></tr>
<tr><td align=left>
<button name="sendbutton"  onclick="sendChatInfo()" onKeyDown="javascript: hotkey();" >发送</button>(快捷键:ctrl+ENTER)
</td></tr>
</table>
</form>
</td>
</tr>
<tr style="height:10px;" ><td colspan=3><a onclick="allChat()" style="cursor:hand;color:#000000;text-decoration:underline;">查看所有记录</a>&nbsp;
</td></tr>
</table>

</BODY><!-- =============== Script area =======================-->

<SCRIPT LANGUAGE="JavaScript"> ////////////////=====界面初始化=========
function loadok(){
var ch=document.body.clientHeight ;
var msg=document.getElementById("msg");
msg.style.height=(ch-160)+"px";
check();
}
function check(){
//获取内容
         var url = "${pageContext.request.contextPath}/chatInfo.do?method=getGreatByIdJson&oid="+o_id+"&date="+ new Date().getTime();
  new Ajax.Request(url, {method:'get',requestHeaders: {Accept: 'application/json'},onSuccess: function(transport) {   
  var msgVar = document.getElementById("msg");
  var divContent="";
var autoScroll = true, height = msgVar.offsetHeight, lh = 20;
var maxid = o_id;
var json = transport.responseText.evalJSON(true);
var date = new Date();
  var msgVar = document.getElementById("msg");
  for ( var i = json.length-1; i >=0 ; i--) {
  date.setTime(json[i].chatDate.time);
  if(maxid < json[i].CId)
    maxid = json[i].CId;
divContent += "<div width=80  class='colorClass'>"
+json[i].chatName
+ ":&nbsp;("
+ date.toLocaleTimeString()
+ ")</div><div style='border-left:solid 20px #ffffff;border-bottom:solid 15px #ffffff' >"
+ json[i].content
+ "</div>";
}
         var autoScroll = true, height = msgVar.offsetHeight, lh = 20;
        (function(){
             autoScroll = (msgVar.scrollHeight - msgVar.scrollTop - height + lh) < 5 ? true : false;
             msgVar.innerHTML += divContent;
             if(autoScroll){
                 msg.scrollTop = msg.scrollHeight - height + lh;
                 msgVar.scrollTop = msgVar.scrollHeight ;
             } 
         })();
if(maxid != o_id)
{
   o_id = maxid;
}
  } }); 
}

}function sendChatInfo(){
var url = "${pageContext.request.contextPath}/chatInfo.do?method=save&date="+ new Date().getTime();
  new Ajax.Request(url,
  {
  method:
  'post',parameters:{'content':c,'content_pure':p}, 
  onSuccess: function(transport) {
  var json = transport.responseText.evalJSON(true);
if(o_id ==-1)  
  o_id = json.CId - 10;
check();
  }
});

}setInterval("check()",10000);
</script>
</HTML>