jQuery的選擇器分類

2021-08-20 14:01:23 字數 2462 閱讀 5754

1.基本選擇器

$("#id")            //id選擇器

$("div")            //元素選擇器

$(".classname")     //類選擇器

$(".classname,.classname1,#id1")     //組合選擇器

2.層次選擇器

$("#id>.classname ")    //子元素選擇器

$("#id .classname ")    //後代元素選擇器

$("#id + .classname ")    //緊鄰下乙個元素選擇器

$("#id ~ .classname ")    //兄弟元素選擇器

3.過濾選擇器(重點

)

$("li:first")    //第乙個

li$("li:last")     //最後乙個

li$("li:even")     //挑選下標為偶數的

li$("li:odd")      //挑選下標為奇數的

li$("li:eq(4)")    //下標等於4的

li$("li:gt(2)")    //下標大於2的

li$("li:lt(2)")    //下標小於2的

li$("li:not(#runoob)") //挑選除

id="runoob"

以外的所有

li3.2內容過濾選擇器

$("div:contains('runob')")    // 包含

runob

文字的元素

$("td:empty")                 //不包含子元素或者文字的空元素

$("div:has(selector)")        //含有選擇器所匹配的元素

$("td:parent")                //含有子元素或者文字的元素

3.3可見性過濾選擇器

$("li:hidden")       //匹配所有不可見元素,或

type

為hidden

的元素$("li:visible")      //匹配所有可見元素

3.4屬性過濾選擇器

$("div[id]")        //所有含有

id 屬性的

div

元素$("div[id='123']")        // id屬性值為

123的

div

元素$("div[id!='123']")        // id屬性值不等於

123的

div

元素$("div[id^='qq']")        // id屬性值以

qq開頭的

div

元素$("div[id$='zz']")        // id屬性值以

zz結尾的

div

元素$("div[id*='bb']")        // id屬性值包含bb的

div

元素$("input[id][name$='man']") //多屬性選過濾,同時滿足兩個屬性的條件的元素

3.5狀態過濾選擇器

$("input:enabled")    // 匹配可用的

input

$("input:disabled")   // 匹配不可用的

input

$("input:checked")    // 匹配選中的

input

$("option:selected")  // 匹配選中的

option

4.表單選擇器

$(":input")      //匹配所有

input, textarea, select

和 button

元素$(":text")       //所有的單行文字框,

$(":text")

等價於$("[type=text]")

,推薦使用

$("input:text")

效率更高,下同

$(":password")   //所有密碼框

$(":radio")      //所有單選按鈕

$(":checkbox")   //所有核取方塊

$(":submit")     //所有提交按鈕

$(":reset")      //所有重置按鈕

$(":button")     //所有

button

按鈕$(":file")       //所有檔案域

jQuery選擇器分類

id id選擇器 div 元素選擇器 classname 類選擇器 classname,classname1,id1 組合選擇器 id classname 子元素選擇器 id classname 後代元素選擇器 id classname 緊鄰下乙個元素選擇器 id classname 兄弟元素選擇器...

jquery 選擇器分類

1.基本選擇器 1.標籤選擇器 元素選擇器 語法 html標籤名 獲得所有匹配標籤名稱的元素 2.id選擇器 語法 id的屬性值 獲得與指定id屬性值匹配的元素 3.類選擇器 語法 class的屬性值 獲得與指定的class屬性值匹配的元素 4.並集選擇器 語法 選擇器1,選擇器2.獲取多個選擇器選...

jQuery選擇器分類,總結

1 基本選擇器 1,根據id匹配元素 2,根據給定的類名匹配元素 3,根據給定的元素名匹配元素 4,匹配所有的元素 5,集合元素,將每個選擇器匹配到的元素合併後一起返回 這是乙個p元素 這是span元素 這是乙個div 2 層次選擇器 1,後代元素選擇器 2,子元素選擇器 3,相鄰元素 緊接在前乙個...