o.k.
I did some testing:
I must say that using clientHeight as archrajan sugested seems like the basis to the solution.
what you you should exactly do depends on the structure of your table.
suppose it is a single td and formattign is always the same you can just premeasure and
see what client hights you get per No. of text rows.
If you could tell us more about the table you are try to cound the rows in then I could suggest how to handle it,
basicly if its a row by row table
I would not measure the clientHeight for the TABLE but for the TD's of each row
this way I would not get marin and border measures effecting the rowcount.
below is my testground :) maybe it will give you additional ideas.
Too bad that the only elements that supports createTextRange are:
BODY, BUTTON, INPUT type=button, INPUT type=hidden, INPUT type=password, INPUT type=reset, INPUT type=submit, INPUT type=text, TEXTAREA
otherwise you could use .getClientRects().length on it (which was my original thought).
as you can see below I tried to use a textarea to mimic the div / TD
until I realized They have a different for alltogether :(
SnowFlake
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<script language=javascript>
function NoOfTextLinesInATD(obj){
r=obj.getBoundingClientRect();
bdr.style.left=r.left;
bdr.style.top=r.top;
bdr.style.width=r.right-r.left;
bdr.style.height=r.bottom-r.top;
alert(obj.clientHeight + ' ' + (r.bottom-r.top));
ta.style.left=r.left + 150;
ta.style.top=r.top ;
ta.style.width=r.right-r.left+25;
ta.style.height=r.bottom-r.top;
ta.value = obj.innerText;
ta.style.font.family=obj.style.font.family;
ta.style.overflow="visible";
oTextRange = ta.createTextRange();
// Get bounding rect of the range
oRcts = oTextRange.getClientRects();
alert(oRcts.length);
}
function go(){
NoOfTextLinesInATD(document.getElementById('div1'));
NoOfTextLinesInATD(document.getElementById('td1'));
NoOfTextLinesInATD(document.getElementById('td2'));
}
</script>
</head>
<body onload="go()">
<div id=bdr style="position:absolute;border:1px solid red;"></div>
<textarea id=ta style="position:absolute;"></textarea>
<Div style="width:100px;" id="div1">The quick brown fox jumps<br>over the lazy dogs</td></tr>
</Div>
<br>
<table style="width:100px;"><tr><td id="td1">The quick brown fox jumps over the lazy dogs</td></tr>
</table>
<br>
<table style="width:150px;" ID="Table1"><tr><td id="td2">The quick brown fox jumps over the lazy dogs</td></tr>
</table>
</body>
</html>
Ny bruger
Nybegynder
Opret
Preview
