1.選擇器

(1)萬用字元：

1. $("input[id^='code']");//id屬性以code開始的所有input標籤

2. $("input[id$='code']");//id屬性以code結束的所有input標籤

3. $("input[id*='code']");//id屬性包含code的所有input標籤

4. $("input[name^='code']");//name屬性以code開始的所有input標籤

5. $("input[name$='code']");//name屬性以code結束的所有input標籤

6. $("input[name*='code']");//name屬性包含code的所有input標籤

7. $("input[name*='code']").each(fuction(){

8. varsum=0;

9. if($(this).val()!=""){

10. sum=parseInt(sum)+parseInt($(this).val());

11. }

12. $("#").text(sum);

13. })

(2)根據索引選擇

1. $("tbody tr:even"); //選擇索引為偶數的所有tr標籤

2. $("tbody tr:odd"); //選擇索引為奇數的所有tr標籤

(3)獲得jqueryObj下一級節點的input個數

jqueryObj.children("input").length;

(4)獲得class為main的標籤的子節點下所有標籤

$(".main > a");

(5)選擇緊鄰標籤

jqueryObj.next("div");//獲取jqueryObj標籤的後面緊鄰的一個div，nextAll獲取所有

2.篩選器

1. //not

2. $("#code input:not([id^='code'])");//id為code標籤內不包含id以code開始的所有input標籤

3.事件

1. //處理文字框上的鍵盤操作

2. jqueryObj.keyup(function(event){

3. varkeyCode = event.which;//獲取當前按下鍵盤的鍵值，回車鍵為13

4. }

4.工具函式

$('#someField').val($.trim($('#someField').val()));//消除空格，語法：$.trim(value)

ps：jQuery選擇器總結

jQuery 的選擇器可謂之強大無比，這裡簡單地總結一下常用的元素查詢方法 

$("#myELement")    選擇id值等於myElement的元素，id值不能重複在文件中只能有一個id值是myElement所以得到的是唯一的元素

$("div")           選擇所有的div標籤元素，返回div元素陣列

$(".myClass")      選擇使用myClass類的css的所有元素

$("*")             選擇文件中的所有的元素，可以運用多種的選擇方式進行聯合選擇：例如$("#myELement,div,.myclass")

層疊選擇器：

$("form input")         選擇所有的form元素中的input元素 $("#main > *")          選擇id值為main的所有的子元素  $("label + input")     選擇所有的label元素的下一個input元素節點，經測試選擇器返回的是label標籤後面直接跟一個input標籤的所有input標籤元素 $("#prev ~ div")       同胞選擇器，該選擇器返回的為id為prev的標籤元素的所有的屬於同一個父元素的div標籤

基本過濾選擇器：

$("tr:first")               選擇所有tr元素的第一個 $("tr:last")                選擇所有tr元素的最後一個  $("input:not(:checked) + span")   

過濾掉：checked的選擇器的所有的input元素   

$("tr:even")               選擇所有的tr元素的第0，2，4... ...個元素（注意：因為所選擇的多個元素時為陣列，所以序號是從0開始）   $("tr:odd")                選擇所有的tr元素的第1，3，5... ...個元素  $("td:eq(2)")             選擇所有的td元素中序號為2的那個td元素  $("td:gt(4)")             選擇td元素中序號大於4的所有td元素  $("td:ll(4)")              選擇td元素中序號小於4的所有的td元素  $(":header")  $("div:animated")

內容過濾選擇器： 

$("div:contains('John')") 選擇所有div中含有John文字的元素 $("td:empty")           選擇所有的為空（也不包括文字節點）的td元素的陣列  $("div:has(p)")        選擇所有含有p標籤的div元素  $("td:parent")          選擇所有的以td為父節點的元素陣列

視覺化過濾選擇器： 

$("div:hidden")        選擇所有的被hidden的div元素 $("div:visible")        選擇所有的視覺化的div元素

屬性過濾選擇器：

$("div[id]")           選擇所有含有id屬性的div元素 $("input[name='newsletter']")    選擇所有的name屬性等於'newsletter'的input元素  $("input[name!='newsletter']") 選擇所有的name屬性不等於'newsletter'的input元素  $("input[name^='news']")         選擇所有的name屬性以'news'開頭的input元素  $("input[name$='news']")         選擇所有的name屬性以'news'結尾的input元素  $("input[name*='man']")          選擇所有的name屬性包含'news'的input元素  $("input[id][name$='man']")    可以使用多個屬性進行聯合選擇，該選擇器是得到所有的含有id屬性並且那麼屬性以man結尾的元素

子元素過濾選擇器：

$("ul li:nth-child(2)"),$("ul li:nth-child(odd)"),$("ul li:nth-child(3n + 1)")    $("div span:first-child")          返回所有的div元素的第一個子節點的陣列  $("div span:last-child")           返回所有的div元素的最後一個節點的陣列  $("div button:only-child")       返回所有的div中只有唯一一個子節點的所有子節點的陣列

表單元素選擇器： 

$(":input")                  選擇所有的表單輸入元素，包括input, textarea, select 和 button 

$(":text")                     選擇所有的text input元素 $(":password")           選擇所有的password input元素  $(":radio")                   選擇所有的radio input元素  $(":checkbox")            選擇所有的checkbox input元素  $(":submit")               選擇所有的submit input元素  $(":image")                 選擇所有的image input元素  $(":reset")                   選擇所有的reset input元素  $(":button")                選擇所有的button input元素  $(":file")                     選擇所有的file input元素  $(":hidden")               選擇所有型別為hidden的input元素或表單的隱藏域

表單元素過濾選擇器： 

$(":enabled")             選擇所有的可操作的表單元素 $(":disabled")            選擇所有的不可操作的表單元素  $(":checked")            選擇所有的被checked的表單元素  $("select option:selected") 選擇所有的select 的子元素中被selected的元素

選取一個 name 為”S_03_22″的input text框的上一個td的text值

?

名字以”S_”開始，並且不是以”_R”結尾的

?

一個名為 radio_01的radio所選的值

?

$("A B") 查詢A元素下面的所有子節點，包括非直接子節點 $("A>B") 查詢A元素下面的直接子節點 $("A+B") 查詢A元素後面的兄弟節點，包括非直接子節點 $("A~B") 查詢A元素後面的兄弟節點，不包括非直接子節點

1. $("A B") 查詢A元素下面的所有子節點，包括非直接子節點

例子：找到表單中所有的 input 元素

HTML 程式碼: 

?

jQuery 程式碼:

?

結果:

?

2. $("A>B") 查詢A元素下面的直接子節點

例子：匹配表單中所有的子級input元素。

HTML 程式碼: 

?

jQuery 程式碼:

?

結果:

?

3. $("A+B") 查詢A元素後面的兄弟節點，包括非直接子節點

例子：匹配所有跟在 label 後面的 input 元素

HTML 程式碼: 

?

jQuery 程式碼:

?

結果:

?

4. $("A~B") 查詢A元素後面的兄弟節點，不包括非直接子節點

例子：找到所有與表單同輩的 input 元素

HTML 程式碼:

?

jQuery 程式碼: 

?

結果:

?

1. 基礎選擇器 Basics

2.層次選擇器 Hierarchy

3.基本過濾器 Basic Filters

4. 內容過濾器 Content Filters

5.可見性過濾器  Visibility Filters

6.屬性過濾器 Attribute Filters

7.子元素過濾器 Child Filters

8.表單選擇器 Forms 

9.表單過濾器 Form Filters

以jQuery(v1.3.2)為基礎from：http://bbs.chinaandroid.com/showtopic-89.aspx 1).基本 ·#id 根據給定的ID匹配一個元素。例如：$("#id") ·element 根據給定的元素名匹配所有元素。例如：$("div") ·.class 根據給定的類匹配元素。例如：$(".style1");  ·* 匹配所有元素。例如：$("*") ·selector1,selector2,selectorN 將每一個選擇器匹配到的元素合併後一起返回。例如：$("#id,div,.style1") 2).表單 ·:button 匹配所有按鈕。例如：$(":button")  ·:checkbox 匹配所有複選框。例如：$(":checkbox") ·:file 匹配所有檔案域。例如：$(":file")  ·:hidden 匹配所有不可見元素，或者type為hidden的元素。例如：$("input:hidden")  ·:image 匹配所有影象域。例如：$(":image")  ·:input 匹配所有 input, textarea, select 和 button 元素。例如：$(":input") ·:password 匹配所有密碼框。例如：$(":password") ·:radio 匹配所有單選按鈕。例如：$(":radio") ·:reset 匹配所有重置按鈕。例如：$(":reset") ·:submit 匹配所有提交按鈕。例如：$(":submit") ·:text 匹配所有的單行文字框。例如：$(":text") ·:header 匹配如 h1, h2, h3之類的標題元素。例如：$(":header").css("background", "#EEE"); 2.篩選條件 1).屬性篩選 ·[attribute*=value] 匹配給定的屬性是以包含某些值的元素。例如：$("input[name*='man'") ·[attribute!=value] 匹配所有含有指定的屬性，但屬性不等於特定值的元素。例如：$(input[name!='man');  ·[attribute$=value] 匹配給定的屬性是以某些值結尾的元素。例如：$("input[name$='man']") ·[attribute=value] 匹配給定的屬性是某個特定值的元素。例如：$("input[name='man']");  ·[attribute] 匹配包含給定屬性的元素。例如：$("div[id]") ·[attribute^=value] 匹配給定的屬性是以某些值開始的元素。例如：$("input[name^='man']")  ·[selector1][selector2][selectorN] 同時滿足多個條件。例如：$("input[id][name$='man']")  ·:hidden 匹配所有的不可見元素。例如：$("tr:hidden") ·:visible 匹配所有的可見元素。例如：$("tr:visible") ·:checked 匹配所有選中的被選中元素(複選框、單選框等，不包括select中的option)。例如：$("input:checked") ·:disabled 匹配所有不可用元素。例如：$("input:disabled") ·:enabled 匹配所有可用元素。例如：$("input:enabled")  ·:selected 匹配所有選中的option元素。例如：$("select option:selected") 2).內容篩選 ·:contains(text) 匹配包含給定文字的元素。例如：$("div:contains('John')") ·:empty 匹配所有不包含子元素或者文字的空元素。例如：$("td:empty") ·:has(selector) 匹配含有選擇器所匹配的元素的元素。例如：$("div:has(p)"); ·:parent 匹配含有子元素或者文字的元素。例如：$("td:parent") 3).層級篩選 ·ancestor descendant 在給定的祖先元素下匹配所有的後代元素。例如：$("form input")  ·parent > child 在給定的父元素下匹配所有的子元素。例如：$("form > input") ·prev + next 匹配所有緊接在 prev 元素後的 next 元素。例如：$("label + input")  ·prev ~ siblings 匹配 prev 元素之後的所有 siblings 元素。例如：$("form ~ input") ·:first-child 匹配第一個子元素。例如：$("ul li:first-child") ·:last-child 匹配最後一個子元素。例如：$("ul li:last-child") ·:nth-child(index/even/odd/equation) 匹配其父元素下的第N個子或奇偶元素。例如：$("ul li:nth-child(2)") ·:only-child 如果某個元素是父元素中唯一的子元素，那將會被匹配。例如：$("ul li:only-child") 4).方法篩選 ·:animated 匹配所有正在執行動畫效果的元素。例如：$("div:animated"); ·:eq(index) 匹配一個給定索引值的元素。例如：$("tr:eq(1)") ·:even 匹配所有索引值為偶數的元素，從 0 開始計數。例如：$("tr:even") ·:first 匹配找到的第一個元素。例如：$("tr:first") ·:gt(index) 匹配所有大於給定索引值的元素，從 0 開始計數。例如：$("tr:gt(0)") ·:last 匹配找到的最後一個元素。例如：$("tr:last") ·:lt(index) 匹配所有小於給定索引值的元素。例如：$("tr:lt(2)")  ·:not(selector) 去除所有與給定選擇器匹配的元素。例如：$("input:not(:checked)")  ·:odd 匹配所有索引值為奇數的元素，從 0 開始計數。例如：$("tr:odd")

jQuery獲取Select選擇的Text和Value: 語法解釋： 1. $("#select_id").change(function(){//code...}); //為Select新增事件，當選擇其中一項時觸發 2. var checkText=$("#select_id").find("option:selected").text(); //獲取Select選擇的Text 3. var checkValue=$("#select_id").val(); //獲取Select選擇的Value 4. var checkIndex=$("#select_id ").get(0).selectedIndex; //獲取Select選擇的索引值 5. var maxIndex=$("#select_id option:last").attr("index"); //獲取Select最大的索引值  jQuery設定Select選擇的Text和Value: 語法解釋： 1. $("#select_id ").get(0).selectedIndex=1; //設定Select索引值為1的項選中 2. $("#select_id ").val(4); //設定Select的Value值為4的項選中 3. $("#select_id option[text='jQuery']").attr("selected", true); //設定Select的Text值為jQuery的項選中   jQuery新增/刪除Select的Option項： 語法解釋： 1. $("#select_id").append("<option value='Value'>Text</option>"); //為Select追加一個Option(下拉項)2. $("#select_id").prepend("<option value='0'>請選擇</option>"); //為Select插入一個Option(第一個位置) 3. $("#select_id option:last").remove(); //刪除Select中索引值最大Option(最後一個) 4. $("#select_id option[index='0']").remove(); //刪除Select中索引值為0的Option(第一個) 5. $("#select_id option[value='3']").remove(); //刪除Select中Value='3'的Option 5. $("#select_id option[text='4']").remove(); //刪除Select中Text='4'的Option   //遍歷option和新增、移除option function changeShipMethod(shipping){ var len = $("select[@name=ISHIPTYPE] option").length if(shipping.value != "CA"){ $("select[@name=ISHIPTYPE] option").each(function(){ if($(this).val() == 111){ $(this).remove(); } }); }else{  www.2cto.com$("<option value='111'>UPS Ground</option>").appendTo($("select[@name=ISHIPTYPE]")); } }  //遍歷一組select，並設定選中值$("div:first select").each(function(){$("div:first select option[value='0']").attr("selected", true);}); //取得下拉選單的選取值  $(#testSelect option:selected').text(); 或$("#testSelect").find('option:selected').text(); 

或$("#testSelect").val();