DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> 常見的jQuery選擇器匯總
常見的jQuery選擇器匯總
編輯: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")

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved