經常使用jQuery選擇器總結 （二）

基本元素選擇器

 

代碼以下:

$("p")
$("p.ii")選取全部class=ii的 p元素
$("p#demo")選取id=demo的第一個p元素

 

分層選擇器

 

代碼以下:

$("div input")div 下的全部input
$("div>input")

 

基本條件選擇器

 

代碼以下:

$("p:first")
$("p:last")
$("tr:even")選擇偶數行
$("tr:odd")奇數
$("input:not(:checked)")選擇全部爲本選中的元素
$("tr:eq(1)")索引值爲1的表格
$("tr:gt(0)")大於0
$("tr:lt(0)")小於0
$(":header")選擇全部標題元素
$(":animated")正在執行的動畫

 

內容條件選擇器

 

代碼以下:

$("div:constains('ddd')")選擇包含ddd文本的層元素
$("td:empty")選擇不包含文本或者子元素的表格單元
$("div:has(p)")選擇包含段落元素的層元素
$("td:parent")選擇包含子元素或者文本的表格單元

 

可見性條件選擇器

 

代碼以下:

$("tr:hidden")  //選擇全部隱藏的表格
$("tr:visible") 選擇全部可見的表格

 

屬性選擇器

 

代碼以下:

$("div[id]")具備id屬性的層
$("input[name='']") input屬性name=''
$("input[name!='']")
$("input[name^='']")選擇具備name屬性而且值爲‘'爲起始內容的表單輸入元素
$("input[name$='']")選擇具備name屬性而且值爲‘'爲結束內容的表單輸入元素
$("input[name*='']")選擇具備name屬性而且值爲‘'的表單輸入元素
$("input[id][name$='']")選擇具備id和name屬性的值以‘'爲結束內容的輸入表單元素

 

子元素選擇器

 

代碼以下:

$("ul li:nth-child(2)")選擇第二個列表項
$("ul li:nth-child(even)")
$("ul li:nth-child(odd)")
$("ul li:nth-child(3n)")
$("ul li:first-child")
$("ul li:last-child")
$("ul li:only-child")選擇列表出現且僅出現一個列表項

 

表單元素選擇器

 

代碼以下:

$("input")選擇全部 input textarea select button等元素
$(":text")文本行
$(":password")
$(":radio")
$(":checkbox")
$(":submit")
$(":image")
$(":reset")
$(":button")
$(":file")
$(":hidden")

 

表單屬性選擇器

 

代碼以下:

$("input:enabled")  //選擇全部可用 $("input:disabled") $("input:checked") $("select:option:selected")