请教下页面显示/隐藏部分tr出现FF下正常IE下偏慢可能是什么原因？

想实现的效果就是显示/隐藏部分tr来达到展开/收起的效果，测试页面如下，也没有什么问题。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
function hide(id, count)
{
var x;
for (var i=1; i<count; i++)
{
x = document.getElementById(id+'Sub'+i)
if (x.style.display == "")
x.style.display = "none";
else
x.style.display = "";
}
}
</script>
</head>
<body>
<table border="1">
<tr id="1"><td><input type="button"  onclick="hide(1, 5)" value="点我" /></td><td>AAAA</td></tr>
<tr id="1Sub1" style="display:none"><td></td><td>AAAA1</td></tr>
<tr id="1Sub2" style="display:none"><td></td><td>AAAA2</td></tr>
<tr id="1Sub3" style="display:none"><td></td><td>AAAA3</td></tr>
<tr id="1Sub4" style="display:none"><td></td><td>AAAA4</td></tr>

<tr id="2"><td><input type="button"  onclick="hide(2, 5)" value="点我" /></td><td>BBBB</td></tr>
<tr id="2Sub1" style="display:none"><td></td><td>BBBB1</td></tr>
<tr id="2Sub2" style="display:none"><td></td><td>BBBB2</td></tr>
<tr id="2Sub3" style="display:none"><td></td><td>BBBB3</td></tr>
<tr id="2Sub4" style="display:none"><td></td><td>BBBB4</td></tr>

<tr id="3"><td><input type="button"  onclick="hide(3, 5)" value="点我" /></td><td>CCCC</td></tr>
<tr id="3Sub1" style="display:none"><td></td><td>CCCC1</td></tr>
<tr id="3Sub2" style="display:none"><td></td><td>CCCC2</td></tr>
<tr id="3Sub3" style="display:none"><td></td><td>CCCC3</td></tr>
<tr id="3Sub4" style="display:none"><td></td><td>CCCC4</td></tr>

</table>
</body>
</html>
现在的问题是，当页面元素比较复杂（table的布局），数据量比较大时（加上隐藏的大概总记录在几千行，页面2M左右），点击展开/收起，在FF下基本无延迟（约半秒左右），而在IE下延迟非常明显，大概需要3-5秒的时间。请问这个主要是什么原因？有什么改进的方法么？现在完全没头绪，不知道该从什么地方修改，请教诸位了。多谢。