主要分為一下幾類
一、基本選擇器
(1)#id $("#id") 返回單個元素
(2).class $(".demo") 返回集合元素
(3)element $("p") 返回集合元素
(4)* $("*") 選擇全部元素 返回集合元素
(5)a,b,c $("#id,.demo") 選擇多個元素 返回集合元素
二、層次選擇器
(1)a b $("#id .demo") 選擇#id裡面的全部class為demo的標籤 包含了該標籤的子元素 返回集合元素
(2)a>b $("#id>.demo") 選擇#id裡面全部class為demo的標籤 不包含該標籤的子元素 返回集合元素
(3)a + b $(「#id+.demo」) 選擇#id元素後的下乙個class為demo的同輩元素。 返回集合元素
(4)a~b $("#id~.demo") 選擇#id之後的全部class為demo的同輩元素 返回集合元素
三、過濾選擇器
1、基本過濾選擇器
(1) :first $(".demo:first") 選擇第乙個class為demo的元素 返回單個元素
(2) :last $(".demo:last") 選擇最後乙個class為demo的元素 返回單個元素
(3) :not(a)
$("input:not(.demo)")選擇class不是demo的元素
返回集合元素
(4) :even
$("input:event")
選擇索引是奇數的input元素
返回集合元素
(5) :odd
$("input:odd")
選擇索引是偶數的input元素
返回集合元素
(6) :eq(index)
$("input:eq(1)")
選擇索引是1的input元素
返回單個元素
(7) :gt(index)
$(""input:gt(1)")
選擇索引大於1的input元素
返回集合元素
(8) :lt(index)
選擇索引小於
1的input元素 返回集合
元素(9) :header
$("div:header")
選擇div內的全部h標籤
返回集合元素
(10) :animated
$("div:animated")
選擇正在執行動畫的animated
返回集合元素
(11) :focus
$("input:focus")
選擇獲得焦點的input
返回集合元素
2、內容過濾器
(1) :contains(text) $(div:contains('我')) 選擇div中含有我的div元素
返回集合元素
(2) :empty
$("div:empty")
選擇不含有不論什麼文字或子元素的div
返回集合元素
(3) :has(selector) $("div:has(p)")
選擇含有p元素的div
返回集合元素
(4) :parent
$("div:parent")
選取擁有子元素的div
返回集合元素
3、可見性過濾器
(1) :hidden
選擇全部不可見的元素
返回集合元素
(2) :visible
選擇所以可見的元素
返回集合元素
4、屬性過濾器
(1) [attribute]
$("div[title]")
選擇所以有title屬性的div
返回集合元素
(2) [attribute=a]
$("div[title=test]")
選擇全部title=test的div
返回集合元素
(3) [attrebute!=a]
選擇所以attribute不等於a的元素
返回集合元素
(4) [attribute^=a]
選擇以a開頭的attribute 的標籤
返回集合元素
(5) [attribute$=a]
選擇以a結尾的attribute的標籤
返回集合元素
(6) [attribute*=a]
選擇包括a的attribute 的標籤
返回集合元素
(7) [attribute|=a]
選擇等於a或者是a為字首 的標籤
返回集合元素
(8) [(1)][(i)]
$(「div[title][class=demo]」)
屬性過濾器能夠連用
返回集合元素
5、子元素過濾器
(1) :nth-child(index/even/odd/equation)
選取每乙個父元素下第index個子元素或者是奇偶元素
返回集合元素
(2) :first-child
返回集合元素
(3) :last-child
返回集合元素
(4) :only-child
$("div p:only")
假設某元素是他父親元素中的唯一的子元素,則將被匹配
返回集合元素
6、表單物件過濾器
(1):enabled
$("#form1 :enabled") 選取id為form1表單被全部的可用元素
返回集合元素
(2):disabled
返回集合元素
(3):checked
$(「input:checked」)
選取全部被選中的元素(包含單選框,核取方塊)
返回集合元素
(4):selected
$(select option :selected) 選取全部被選中的選項元素(包含下拉列表)
返回集合元素
四、表單選擇器
(1) :input
$(":input")
選取全部的元素
返回集合元素
(2) :text
$(":text")
選取全部的單行文字框
返回集合元素
應用舉例:
$("p").click(function);
$("#tb tbody tr:even"),css("background","#000000");
$("#btn").click(function);
jQuery選擇器總結
父元素中所有的子元素,不包括後代元 父元素 子元素 選擇某元素的緊挨著的元素 如果不存在則什麼都不選擇 某元素 需要查詢的元素 層次選擇器4 個 選擇父元素中的某些元素 父元素 子元素 選擇選擇兄弟元素 可以間隔其他元素 某元素 需要查詢的元素 簡單選擇器10 個 簡單選擇器的特點是有個 first...
Jquery選擇器總結
jquery中的選擇器通用的格式為 selector 這裡的selector總的來說可以按照幾種類別進行選擇 1 按照元素的名稱選 這時直接寫元素的名稱即可,此時返回的是所有該名稱元素的集合。如 a 選擇所有的元素,是個集合陣列 p 選擇所有的元素 2 按照元素的id屬性選擇 這時selector的...
jQuery選擇器總結
jquery 的選擇器可謂之強大無比,這裡簡單地總結一下常用的元素查詢方法 myelement 選擇id值等於myelement的元素,id值不能重複在文件中只能有乙個id值是myelement所以得到的是唯一的元素 div 選擇所有的div標籤元素,返回div元素陣列 myclass 選擇使用my...