我有一个网页,我有一个表嵌套在一个TD标记(不要为这个火上浇油,我有一个很好的理由这样做)。当页面加载时,我想将嵌套表的高度扩展为包含它的TD单元格的高度。目前我使用的代码如下:
$(document).ready(function()
{
$('.TakeOffItemGroupTable').each(function()
{
$(this).height($(this).closest('td').height());
});
}
这是可行的,但是如果页面上有很多表需要调整大小,IE8可能需要大约20秒才能完成(当然,FF需要一两秒钟)。因为
$(this).height($(this).closest('td').height());
需要:1毫秒铬合金
Firefox中的18ms
IE8中330ms
是否有其他方法可以让嵌套表始终占据其容器的高度?
我尝试过的事情:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<table border="1" >
<tr>
<td width="100px">JKLSD FASJDFKLSA DFKLADFJL KASDJFKLSAD JFSAKLDF</td>
<td style="height: 100%;">
<table style="height:100%;" border="1">
<tr>
<td>
I should be 100% tall!
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
这在Firefox中有效,但在IE中无效。
最佳答案
我认为使用correct HTML Doctype的第二个示例也可以在IE中使用,而不需要任何Javascript。
以下内容适用于FF和IE 6、7和8:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<table style="height: 100%" border="1" >
<tr><td>
<table style="height:100%" border="1">
<tr>
<td>
I am 100% tall!
</td>
</tr>
</table>
</td></tr>
</table>
</body>
</html>
关于html - 如何使TABLE成长为与其容器相同的高度? (或与IE JavaScript的速度作斗争),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/2007794/