$("*") // 所有元素選擇器把沼,包括 HTML甚颂、head 和 body。
$("#id") // ID選擇器埃跷,id 屬性在文檔內(nèi)必須是唯一的。
$("div") // 元素選擇器憔杨,選擇所有的 div 元素旨巷。
$(".classname") // 類(lèi)選擇器强缘,class 屬性用于為多個(gè) HTML 元素設(shè)置特定樣式。
$(".class1 .class2") // class 為 "class1"下所有 class 為 "class2"的元素察皇,不限于直接子元素捧毛。
$(".class1,.class2") // class 為 "class1" 或者 "class2" 的元素。
$(".class1>.class2") // 選擇所有直接父級(jí)是 class1 元素的 class2 的元素让网。
$(".class1+.class2") // 緊鄰在class 為 "class1"后的一個(gè) class 為 "class2"的元素呀忧。
$(".class1~.class2") // 同一層級(jí)下,也就是同一父元素下溃睹,class 為 "class1"后面所有 class 為 "class2"的元素而账。
$("p:first") // 全局下第一個(gè) p 元素
$("p:last") // 全局下最后一個(gè)p
$("li:even") // 所有偶數(shù) li 元素,索引值從 0 開(kāi)始因篇,第一個(gè)元素是偶數(shù) (0)泞辐,第二個(gè)元素是奇數(shù) (1),以此類(lèi)推竞滓。
$("li:odd") // 所有奇數(shù) li 元素咐吼,索引值從 0 開(kāi)始,第一個(gè)元素是偶數(shù) (0)商佑,第二個(gè)元素是奇數(shù) (1)锯茄,以此類(lèi)推。
$("li:not(#runoob)") //挑選除 id="runoob" 以外的所有l(wèi)i
$("p:only-child") // 當(dāng)前父元素下只有自己一個(gè)子元素
$("p:only-of-type") // 當(dāng)前父元素下只有自己一個(gè) p 子元素茶没,有其他類(lèi)型的子元素?zé)o所謂
$("p:first-child") // 其父元素的第一個(gè)子元素是 p 元素的元素
$("p:nth-child(2)") // 其父元素的第二個(gè)子元素是 p 元素的元素
$("p:first-of-type") // 其父元素的第一個(gè)是 p 元素的元素
$("p:nth-of-type(2)") // 其父元素的第一個(gè)是 p 元素的元素
$("div p:first-child") // 選擇所有 div 元素下的第一個(gè) p 元素
last 選擇器部分省略肌幽,方法同 first
舉例:
:first , :first-child , first-of-type 的區(qū)別
<div>
<p>div 中第一個(gè)段落,是 div 的第一個(gè)子元素抓半。</p>
<!-- 在這里:first有效喂急,first-child有效,first-of-type有效 -->
<p>div 中的最后一個(gè)段落笛求,是 div 的最后一個(gè)子元素廊移。</p>
</div><br>
<div>
<span>這是一個(gè) span 元素,是 div 中的第一個(gè)子元素探入。</span>
<p>另一個(gè) div 中第一個(gè)段落狡孔,是 div 中的第二個(gè)子元素。</p>
<!-- 在這里:first無(wú)效新症,first-child無(wú)效步氏,first-of-type有效 -->
<p>另一個(gè) div 中的最后一個(gè)段落, 是 div 中的第三個(gè)子元素。</p>
<span>這是一個(gè) span 元素徒爹,是 div 中的最后一個(gè)子元素荚醒。</span>
</div><br>
關(guān)于 :only-child:
<div>
<p>只有一個(gè)子元素</p>
<!-- $("p:only-child")有效 -->
</div><br>
$("ul li:eq(3)") // 列表中的第四個(gè)元素(index 值從 0 開(kāi)始)
$("ul li:gt(3)") // 列舉 index 大于 3 的元素
$("ul li:lt(3)") // 列舉 index 小于 3 的元素芋类,index=0、1界阁、2的前三個(gè)元素
$("div:contains('hello')") // 選取包含指定"hello"字符串的元素侯繁。
// 該字符串可以是直接包含在元素中的文本,或者被包含于子元素中泡躯。
$("div:has(p)") // 所有包含有 p 元素在其內(nèi)的 div 元素
$(":header") // 所有標(biāo)題元素 <h1>, <h2> ...
$("li:hidden") //匹配所有不可見(jiàn)的 li 元素贮竟,或type為hidden的元素
$("li:visible") //匹配所有可見(jiàn)的 li 元素
$("td:empty") // 不包含子元素或者文本的空元素
$("td:parent") // 與 :empty 相反,所有非空元素较剃。
$("div[id]") // 所有含有 id 屬性的 div 元素
$("div[id='123']") // id屬性值為123的div 元素
$("div[id!='123']") // id屬性值不等于123的div 元素
$("div[id^='qq']") // id屬性值以qq開(kāi)頭的div 元素
$("div[id$='zz']") // id屬性值以zz結(jié)尾的div 元素
$("div[id*='bb']") // id屬性值包含bb的div 元素
$("div[id~='abc']") // id屬性值包含單詞 abc 的 div 元素咕别,使用漢字詞語(yǔ)也可以
$("input[id][name$='man']") //多屬性選過(guò)濾,同時(shí)滿(mǎn)足兩個(gè)屬性的條件的元素
$("input:enabled") // 匹配可用的 input
$("input:disabled") // 匹配不可用的 input
$("input:checked") // 匹配選中的 input
$("option:selected") // 匹配選中的 option
$(":input") //匹配所有 input, textarea, select 和 button 元素
$(":text") //所有的單行文本框写穴,$(":text") 等價(jià)于$("[type=text]")惰拱,推薦使用$("input:text")定位更準(zhǔn),下同
$(":password") //所有密碼框
$(":radio") //所有單選按鈕
$(":checkbox") //所有復(fù)選框
$(":submit") //所有提交按鈕
$(":reset") //所有重置按鈕
$(":button") //所有button按鈕
$(":file") //所有文件域