基於jQuery選取器的整理集合

jquery對象訪問
1、each(callback):以每個匹配的元素作為上下文來執行一個函數，return false;停止迴圈;return true;跳至下一個迴圈。

來個執行個體 :    
複製代碼 代碼如下:
$("img").each(function(){
       $(this).toggle("example");
})

2、size()與length相同，都是返回jquery對象中元素的個數。

$("img").size();或$("img").length;

3、get():取得所有匹配的DOM元素集合(注意返回是dom對象，而非jquery對象)
複製代碼 代碼如下:
$("img").get().reverse();

4、get(index)：取得其中一個匹配的元素。index表示匹配第幾個元素,使用get(index)方法可以讓你操作一個實際的dom元素。

$("img").get(0);//得到第一個匹配的img元素

$(this).get(0)與$(this)[0]等價

5、index(subject)：搜尋與參數表示的對象匹配的元素，並返回相應元素的索引值。

選取器-基本
selector1,selector2,selectorN將匹配到的元素合并後一起返回
複製代碼 代碼如下:
$("div,span,p.myClass");

這裡要注意幾個相似文法的區別：

1、$("span",this)

比如：
複製代碼 代碼如下:
$("div.foo").click(function() {
    $("span", this).addClass("bar");
});

2、$("div#hi")、$("p.intro")

比如：
複製代碼 代碼如下:
$("div#hi").css("color","red");

3、$("form input")

比如：
複製代碼 代碼如下:
$("form input").css("border", "5px solid red");

要區別上面幾種相似形式的不同意思。

選取器-層級
1.ancestor descendant在給定的祖先元素下匹配所有的後代元素

$("div input");//div下所有input

2.parent > child 在給定的父元素下匹配所有的子項目

$("div > input);//父元素下的子項目

3.prev + next 匹配所有緊接在prev元素後的next元素

$("div + span")//緊接在div後的span

4.prev ~ siblings 匹配prev元素之後的所有siblings元素

$("form ~ input")//找到所有與表單同輩的input元素

選取器-簡單
1.:first 匹配找到的第一個元素

$("tr:first")//尋找表格中第一行

2.:last 匹配找到的最後一個元素
$("tr:last")//匹配找到的最後一個元素

3.:not(selector) 去除所有與給定選取器匹配的元素
   ps:jquery 1.3中，已支援複雜選取器了(例如：:not(div a)和:not(div,a))
   $("input not(:checked)")//所有未被選中的input元素

4.:even 匹配所有索引值為偶數的元素，從0開始計數
   $("tr:even")//尋找表格中偶數行

5.:odd匹配所有索引值為奇數的元素，從0開始計數
   $("tr:odd")//尋找表格中奇數行

6.:eq(index)匹配一個給定索引值的元素
   $("tr:eq(1)")//尋找第二行

7.:gt(index)匹配所有大於給定索引值的元素
   $("tr:gt(0)")//尋找大於0的所有行

8.:lt(index)匹配所有小於給定索引值的元素
$("tr:lt(2)")//尋找小於2的所有行

9.:header 匹配如h1,h2,h3之類的標題元素
   $(":header").css("background",red");//所有標題加上背景色

10.:animated 匹配所有正在執行動畫效果的元素

選取器-內容:
1.:contains(text) 匹配包含給定文本的元素
   $("div:contains('aaa')")尋找所有包含有aaa的div元素

2.:empty()匹配所有不包含子項目或文本的空元素
   $("td:empty")

3.:has(selector)匹配含有選取器所匹配的元素的元素
   $("div:has(p)").addClass("test");//給所有包含p元素的div元素添加一個text類

4.:parent匹配含有子項目或者文本的元素
   $("td:parent");//尋找所有含有子項目或者文本的td元素

選取器-可見度:
1.:hidden匹配所有隱藏元素，input元素的type屬性為hidden的話也會被匹配
   $("tr:hidden");//尋找所有不可見的tr元素

2.:visible匹配所有可見元素
   $("tr:visible");//尋找所有可見的tr元素

選取器-屬性:
1.[attribute]匹配包含給定屬性的元素
    $("div[id]")//尋找所有含有id屬性的div元素

2.[attribute=value]匹配給定的屬性是某個特定值的元素
    $("input[name='username']")//查所所有name=username的input元素

3. [attribute!=value]匹配所有不含有指定屬性，或者屬性不等於特定值的元素
     此選取器等價於:not([attr=value]),要匹配含有特定屬性但不等於特定值的元素，請使用［attr]:not([attr=value])
    $("input[name!='username']")//尋找所有name!=username的input元素

4. [attribute^=value]匹配給定的屬性是以某些值開始的元素
    $("input[name^='user'])//尋找所有name以'newws'開始的input元素

5. [attribute$=value]匹配給定屬性是以某些值結尾的元素
   $("input[name$='letter']) //尋找所有name以'letter'結尾的input元素

6. [attribute*=value]匹配給定的屬性是以包含某些值的元素
   $("input[name*='man']")//尋找所有name包含'man'的input元素

7. [selector1][selector2][selectorN]複合屬性選取器，冉要同時滿足多個條件時用。
    $("input[id][name='man']")//含有id屬性，並且name為man的

選取器-子項目:
1.:nth-child(index/even/odd/equation)匹配其父元素下的第N個子或奇偶元素
    $("ul li:nth-child(2)")//在每個ul尋找第2個li

2. :first-child匹配第一個子項目
    $("ul li:first-child")//在每個ul中尋找第一個li

3.:las-child匹配最後一個子項目
    $("ul li:last-child")// 在第個ul中尋找最後一個li

4.only-child如果某個元素是父元素中唯一的子項目，那將會被匹配，如果父元素中含有其他元素，不會被匹配
   $("ul li:only-child")//在ul中尋找是唯一子項目的li

選取器-表單:
1.:input ，:text ，:password ，:radio ， :checkbox ，:submit ，:image ，:reset ，:button , :file
2.:hidden匹配所有隱藏元素，或type為hidden的元素

選取器-表單對象屬性:
1.:enable匹配所有可用元素
   $("input:enabled")//尋找所有可用的input元素

2.:disabled匹配所有不可用元素
   $("input:disabled")//匹配所有不可用元素

3.:checked匹配所有選中的被選中元素(複選框、單選框、不包括select中的option)
    $("input:checked")//尋找所有選中的複選框元素

4.:selected匹配所有選中的option元素
    $("select option:selected")//尋找所有選中的選項元素