jQuery基本選擇器:
$(“#elem”) ——選取id為elem的元素,返回單個元素。
$(“.test”)——獲取元素集合,返回class為test的元素集合。
$(“P”)—— 獲取標簽集合,返回所有的p標簽。
$(“*”) —— 返回所有的元素。
$(“p,div,td.myClass”) —— 返回p標簽,div,和class為myClass的元素集合。
jQuery層次選擇器:
$(“ancestor descendant”)——選取ancestor元素里的所有descendant元素。$(“div span”)選取<div>里的所有的<span>元素。
$(“parent>child”)——選取parent元素下的child(子)元素。$(“div>span”)選取<div>元素下元素名是<span>的子元素。
$(“prev+next”)——選取緊接在prev元素后的next元素。$(“.one + div”)選取class為one的下一個<div>元素。
$(“prev~siblings”)——選取prev元素之后的所有兄弟元素。$(“#elemId~div”)選取id為elemId的元素后的所有<div>兄弟元素。
jQuery過濾選擇器:
基本過濾選擇器:
:first——選取第一個元素,$(“div:first”)選取所有<div>元素中第一個<div>元素
:last——選取最后一個元素,$(“div:last”)選取所有<div>元素中最后一個<div>元素
:not(selector)——去除所有與給定選擇器匹配的元素,$(“input:not(.myClass)”選取class不是myClass的<input>元素。
:eves——選取索引是偶數的所有元素,索引從0開始。$(“input:even”)選取索引是偶數<input>元素。
:odd——選取索引是奇數的所有元素,索引從0開始。$(“input:odd”)選取索引是奇數<input>元素。
:eq(index)——選取索引等於index的元素,index從0開始。$(“input:eq(1)”)選取索引等於1的元素。
:gt(index)——選取索引大於index的所有元素,index從0開始。$(“input:gt(1)”)選取索引大於1的元素。
:lt(index)——選取索引小於index的所有元素,index從0開始。$(“input:lt(1)”)選取索引小於1的元素。
:header——選取所有的標題元素,例如h1,h2..hn等等。$(“:header”)選取網頁中所有的<h1>,<h2>,<h3>….
:animated——選取當前正在執行動畫的所有元素。$(“div:animated”)選取正在執行動畫的<div>元素。
內容過濾器:
:contains(text)——選取含有文本內容為“text”的所有元素。$(“div:contains(“helloKitty”)”)選取含有文本為“helloKitty”的<div>元素。
:empty——選取不包含子元素或者文本的空元素。$(“div:empty”)選取不包含子元素(包括文本元素)的<div>空元素。
:has(selector)——選取含有選擇器所匹配的元素的元素。$(“div:has(p)”)選取含有<p>元素的<div>元素。
:parent——選取含有子元素或者文本的元素。$(“div:parent”)選取用友子元素(包括文本元素)的<div>元素。
可見性過濾選擇器:
:hidden——選取所有不可見的元素。 $(“:hidden”)選取所有的不可見的元素。包括<input type=”hidden”/>,<div style=”displey:none;”>和<div style=”visibility:hidden;”>等元素,如果只想選取<input>元素,使用$(“input:hidden”).
:visible——選取所有可見的元素。$(“div:visible”)選取所有可見的<div>元素。
屬性過濾選擇器:
[attribute]——選取擁有此屬性的元素。$(“div[id]”)選取用id屬性的div元素。
[attribute=value]——選取屬性的值為value的元素。$(“div[name=hellokitty]”)選取屬性name為“hellokitty”的<div>元素。
[attribute!=value]——選取屬性的值不等於value的元素。$(“div[name!=hellokitty]”)選取屬性name不等於“hellokitty”,或者沒有name屬性的<div>元素。
[attribute^=value]——選取屬性的值以value開始的元素。$(“div[name^=hellokitty]”)選取屬性name以“hellokitty”開始的<div>元素。
[attribute$=value]——選取屬性的值以value結尾的元素。$(“div[name=hellokitty]”)選取屬性name以“hellokitty”結尾的<div>元素。
[attribute*=value]——選取屬性的值為包含value的元素。$(“div[name=hellokitty]”)選取屬性name包含“hellokitty”的<div>元素。
[selector1][selector2][selectorN]——用屬性選擇器合並成一個復合屬性選擇器,滿足多個條件,每個選擇一次,縮小一次的范圍。$(“div[id][title$=’helloKitty’]”)選取擁有屬性id,並且屬性title以“hellokitty”結束的<div>元素。
子元素過濾選擇器: