IE8和jQuery选择器

今天我注意到jQuery选择器和addClass（）函数的组合在IE8上无法正常工作。

例如，当我想确保在表中选择偶数行时，我写道：

jQuery(document).ready(function($){ $("#table1 tr:nth-child(even)").addClass("even"); } 

对于CSS，我写道：

 #table1 tr:nth-child(even), #table1 tr.even { background-color: #ff0; } 

在Firefox，Chrome，Safari和Opera中，即使没有CSS文件中的伪类选择器，也会选择偶数行。 但是，在IE8中，情况并非如此。 行没有不同的背景颜色。

这很奇怪，因为当我使用时：

 jQuery(document).ready(function($){ $("#table1 tr:nth-child(even)").css({"background-color":"#ff0"}); } 

所选行在IE8中突出显示。

---

问题的一个例子是这里可以看到的问题 – 例如24个例子 。 在Firefox，Chrome，Safari和Opera中，奇数行被分配了一个“奇数”类。 但是，在IE8中，它们未被分配“奇数”类，并且未突出显示。

Answer 1

选择器在jQuery端正常工作……但是IE8完全丢弃了样式规则（符合规范 ），因为它无法识别nth-child ：

 tr:nth-child(odd) td, tr.odd td { background-color: #86B486; } 

如果你拆分它，它将正常工作：

 tr:nth-child(odd) td { background-color: #86B486; } tr.odd td { background-color: #86B486; } 

这是原始版本 （IE8删除的单个规则）， 这是一个固定的示例 ，规则拆分。

---

为了完整起见，颠倒这样的规则无济于事：

 tr.odd td, tr:nth-child(odd) td { background-color: #86B486; } 

Answer 2

这对我来说在ie8和ie9中首先需要2个带背景颜色的类

 .even { background-color: white; } .odd { background-color: #ff0; } 

然后用jquery find tr：odd add tr：even并添加相应的类

 $(document).ready(function () { $('#table1').find('tr:odd').addClass("odd"); $('#table1').find('tr:even').addClass("even"); });