鼠标悬停/悬停效果在 IE8 上缓慢

我注意到在 IE8 中，当在包含许多行（本例中为 100 行）的表上使用鼠标悬停事件时，性能会出现奇怪的情况。我尝试了很多不同的方法，但我似乎找不到任何方法来按照我喜欢/需要的速度获得它。

如果我在每个事件上切换类，则所有 IE 版本的性能都会下降，如果我通过 javascript 直接操作 CSS，IE6 和 IE7 会加速很多，但 IE8 的性能仍然很差。

有任何想法吗 ？我真的很想知道是什么使得鼠标悬停事件与所有其他浏览器相比执行得如此缓慢。

如果这种情况只发生在IE6上我可以理解并让它过去，但是当最新版本的浏览器是最慢的浏览器时，只会有越来越多的用户体验不好。

使用 JQuery 悬停的示例：http://thedungheap.net/research/ http://thedungheap.net/research/

EDIT:我现在更新了示例，以便很容易看出 10 行和 200 行之间的区别。这是在同一个文档中，所以我猜这不会是整个 DOM 大小的问题

:hover 在 IE8 上非常慢，无论您​​打算如何实现它。事实上，javascript onmouseover、onmouseout 事件提供了比 CSS 更快的方法来创建悬停效果

IE8 上最快的示例：

<table>
<tr style="background-color:#FFFFFF" onmouseover="this.style.backgroundColor='#000000'" onmouseout="this.style.backgroundColor='#FFFFFF'">
   <td>foo bar</td>
</tr>
</table>

较慢的示例：

<style type="text/css">
   tr.S1    {background-color:#000000}
   tr.S2    {background-color:#FFFFFF}
</style>
<table>
<tr class="S1" onmouseover="this.className='S2'" onmouseout="this.className='S1'">
   <td>foo bar</td>
</tr>
</table>

非常慢的例子： JSFiddle http://jsfiddle.net/dXtbt/embedded/result/

<style type="text/css">
   tr.S     {background-color:#000000}
   tr.S:hover   {background-color:#FFFFFF}
</style>
<table>
<tr class="S">
   <td>foo bar</td>
</tr>
</table>