一、元素選擇
* | $("*") | 所有元素 |
element | $("p") | <p> 元素 |
ele1,ele2 | $("th,td") | <th>或<td>元素 |
#id | $("p#lastname") | id="lastname" 的p元素 |
.class | $("p.intro") | class="intro" 的p元素 |
.class.class | $("p.intro.demo") | class="intro" 且 class="demo" 的p元素 |
ele:emtpy | $("p:empty") | 不包含子元素的p元素 |
ele:parent | $("p:parent") | 包含子元素的p元素 |
ele1.has(ele2) | $("div:has(p.intro)") | 有p子元素且子元素屬性爲intro的div元素 |
二、屬性選擇
[attr] | $(p"[href]") | 有href屬性的p元素 |
[attr1][attr2] | $("p[title][href]") | 同時有title和href屬性的p元素 |
[attr=value] | $("p[href='#']") | href 屬性等於"#"的p元素 |
[attr!=value] | $("p[href!='#']") | href 屬性不等於"#"的p元素 |
[attr$=value] | $("p[href$='.jpg']") | href 屬性以".jpg"結尾的p元素 |
[attr^=value] | $("p[href^='fb']") | href 屬性以"fb"開頭的p元素 |
[attr*=value] | $("p[href*='link']") | href 屬性包含"link"的p元素 |
三、內容選擇
:contains(value) | $("p:contains('W3School')") | 包含指定字符串的p元素 |
:not() |
$("div:not(:has(p))") $(p:not([href])") $("p:not(:contains('abc'))") |
不包含子元素p的div元素 沒有屬性href的元素 不包含指定字符串的p元素 |
四、關係選擇
ele1 ele2 | $("div li") | 元素div的後代li元素 |
ele1 > ele2 | $("div > li") | 元素div的li子元素 |
:eq(index) | $("ul li:eq(3)") | 選擇第4個li元素 |
:gt(index) | $("ul li:gt(3)") | 選擇第4個以後的元素 |
:lt(index) | $("ul li:lt(3)") | 選擇第4個以前的元素 |
參考:http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp