前面學習了基本選擇器，現在學習過濾選擇器中的簡單過濾選擇器：
簡單過濾選擇器，主要根據索引值對元素進行篩選，這些過濾選擇器類似于CSS的偽類選擇器，他們均以冒號（:）開頭，并且要與另外一個選擇器一起使用。
1.:first選擇器,對當前jquery集合進行過濾選擇，并選擇出第一個匹配元素，語法格式如下：
$("selector:first")
其中，參數selector表示任意有效的選擇器
2.:last選擇器
:last選擇器，對當前jquery集合進行篩選，并選擇出最后一個匹配的元素，語法格式如下。
$("selector:last")
其中，參數selector表示任意有效的選擇器。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>簡單過濾選擇器</title> <script type="text/javascript" src="js/jquery-1.11.0.js"></script> <script type="text/javascript"> $(function () { //將第一列的邊框顏色變成藍色 $("td:first").css("border", "2px solid blue"); //將最后一列的邊框顏色變成紅色 $("td:last").css("border", "2px solid red"); }); </script> </head> <body> <table> <tr> <td>第一列</td> <td>第二列</td> <td>第三列</td> <td>第四列</td> </tr> </table> </body> </html>
3.odd選擇器
:odd選擇器，用于選擇索引為奇數（從0開始計數）的所有元素，語法如下：
$("selector:odd")
其中，參數selector表示任意有效的選擇器。DOM元素，在jquery集合中的索引值從0開始，因此第2個，第4個，和第六個的索引值依次為1，3，5..依次類推。
4.:enen選擇器
:even選擇器，用于選擇索引為偶數（從0開始計數）的所有元素，語法格式：
$("selector：even")
其中，參數selector表示任意有效的選擇器。DOM元素，在jquery集合中的索引值從0開始，因此第1個，第3個，和第5個的索引值依次為0，2，4..依次類推。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>odd選擇器和even選擇器</title> <script type="text/javascript" src="js/jquery-1.11.0.js"></script> <script type="text/javascript"> $(function () { //將索引值為奇數的單元格的背景色，設置為紅色 $("td:odd").css("background", "red"); //將索引值為偶數的單元格的背景色，設置為黃色 $("td:even").css("background", "yellow"); }) </script> </head> <body> <table> <tr> <td>索引為0的列</td> <td>索引為1的列</td> <td>索引為2的列</td> <td>索引為3的列</td> <td>索引為4的列</td> <td>索引為5的列</td> </tr> </table> </body> </html>
5.:eq()選擇器
:eq（）選擇器用于從匹配的集合中選取索引等于給定值的元素，語法格式如下：
$("selector:eq(index)")
其中，index從0開始；
6.gt()選擇器
:gt()選擇器用于從匹配的集合中選取索引大于給定值的所有元素,語法格式如下：
$("selector:gt(index)")
其中index從0開始
7.:lt()選擇器
:lt()選擇器用于從匹配的集合中選取索引小于給定值的所有元素，語法格式如下：
$("selector:lt("index")")
其中index從0開始
8.:not()選擇器
:not()選擇器，用于從匹配的集合中除去所有與給定選擇器匹配的元素，語法格式：
$("selector1:not(selector2)")
eg:$("td:not(:first,:last)")
9.:header選擇器
:header選擇器，用于選擇所有諸如h1,h2,h3之類的標題元素；語法格式：
$(":header")
eg:$（“:header”）.css("color","red");
10.:animated選擇器
:animated選擇器用于所有正在執行動畫效果的元素，語法格式如下：
$("selector：animated")
其中：selector表示任意有效的選擇器。
文章列表
留言列表
