【转】jQuery选择器:nth-child(even) 与:even的区别

首先看一下:nth-child和:even的说明

:nth-child(n)   第n个子节点，n从1开始

:even  页面范围内偶数的匹配元素

那么:nth-child(even) 的意思就是从第1开始的偶数元素，:even的意思是指从第0开始的偶数元素

在实际中一个常见的例子就是，当给表格的偶数行设置变色时，可以跳过表头行，而从第1行开始设置

让我们看一个实际的例子，把表格的偶数行的背景色设置为红色，看一下两种写法的不同结果

用:nth-child(even)

代码：$('table tr:nth-child(even)').css('background-color','red');

效果如下图：

 

1表头	表头
2
3
4
5

 

用:even

 

代码：$('table tr:even').css('background-color','red');

效果如下图：

 

 

0表头	表头
1
2
3
4