一 JQuery選擇器

2021-05-23 02:44:04 字數 2945 閱讀 6925

1 基本選擇器

$(#id)

根據給定的id匹配乙個元素

$(.class)

根據給定的類名匹配元素

$(element)

根據給定的元素名匹配元素

$(*)

匹配所有元素

$(selector1,selector2,...,selectorn)

將每乙個選擇器匹配到的元素合併後一起返回

2 層次選擇器

$("ancestor descendant")

選取ancestor元素裡的所有descendant(後代)元素

$("parent > child")

只選取parent元素下的child(子層級)元素,與$("ancestor descendant")有區別,前者選擇所有後代元素(含且不限於子層級)

$('prev + next')

選取緊接在prev元素後的next元素

$('prev ~ siblings')

選取prev元素之後的next元素

3 過濾選擇器

3.1 基本過濾選擇器

$("selector:first")

選取第乙個元素

$("selector:last")

選取最後乙個元素

$("selector:not(selector2)")

去除所有與給定選擇器匹配的元素

$("selector:even")

選取索引是偶數的所有元素,索引從0開始

$("selector:odd")

選取索引是奇數的所有元素,索引從0開始

$("selector:eq(index)")

選取索引等於index的元素,index從0開始

$("selector:gt(index)")

選取索引大於index的元素,index從0開始

$("selector:lt(index)")

選取索引小於index的元素,index從0開始

$(":header")

選取所有的標題元素,如h1,h2,h3等等

$(":animated")

選取當前正在執行動畫的所有元素

3.2 內容過濾選擇器

$(":contains(text)")

選取含有文字內容為"text"的元素

$(":empty")

選取不包含子元素或者文字的空元素

$(":has(selector2)")

選取含有選擇器所匹配的元素的元素

$(":parent")

選取含有子元素或者文字的元素

3.3 可見性過濾選擇器

$(":hidden")

選取所有不可見的元素

$(":visible")

選取所有可見的元素

3.4 屬性過濾選擇器

$("selector[attribute]")

選取擁有此屬性的元素

$("selector[attribute=value]")

選取屬性的值為value的元素

$("selector[attribute!=value]")

選取屬性的值不等於value的元素

$("selector[attribute^=value]")

選取屬性的值以value開始的元素

$("selector[attribute$=value]")

選取屬性的值以value結束的元素

$("selector[attribute*=value]")

選取屬性的值含有value的元素

$("selector[selector2][selectorn]")

用屬性選擇器合併成乙個復合屬性選擇器,滿足多個條件。每選擇一次,縮小一次範圍,如$("div[id][title$='test']")選取擁有屬性id,並且屬性title以"test"結束的元素

3.5 子元素過濾選擇器

$(":nth-child(index/even/odd/equation)")

選取每個父元素下的第index個子元素或者奇偶元素,index從1算起

$("selector:first-child")

選取每個父元素的第乙個子元素

$("selector:last-child")

選取每個父元素的最後乙個子元素

$("selector:only-child")

如果某個元素是它父元素中唯一的子元素,那麼將會被匹配。如果父元素中含有其他元素,則不會被匹配

3.6 表單物件屬性過濾選擇器

$("selector:enabled")

選取所有可用元素

$("selector:disabled")

選取所有不可用元素

$("selector:checked")

選取所有被選中的元素(radio,checkbox)

$("selector:selected")

選取所有被選中的選項元素(select)

4 表單選擇器

$(":input")

選取所有的,,,元素

$(":text")

選取所有的單行文字框

$(":password")

選取所有的密碼框

$(":radio")

選取所有的單選框

$(":checkbox")

選取所有的核取方塊

$(":submit")

選取所有的提交按鈕

$(":image")

選取所有的影象按鈕

$(":reset")

選取所有的重置按鈕

$(":button")

選取所有的按鈕

$(":file")

選取所有的上傳域

$(":hidden")

選取所有不可見元素

jQuery選擇器 一

選擇器是 jquery 的根基,在 jquery 中,對事件處理,遍歷 dom 和 ajax 操作都依賴於選擇器 jquery選擇器的優點 1 簡潔的寫法 id 2 完善的事件處理機制 若在網頁中,沒有id為 id 的元素,瀏覽器會報錯 需要先判斷document.getelementbyid id...

jQuery選擇器(一)

id siblings 當前元素所有的兄弟節點 id prev 當前元素前乙個兄弟節點 id next 當前元素之後第乙個兄弟節點 id nextall 當前元素之後所有的兄弟節點 id prevall 當前元素之前所有的兄弟節點 id nextall 當前元素之後所有的兄弟節點 返回值 匹配元素 ...

jQuery選擇器(一)

選擇器是 jquery 的根基,在 jquery 中,對事件處理,遍歷 dom 和 ajax 操作都依賴於選擇器 jquery 選擇器的優點 id 等價於 document.getelementbyid id tagname 等價於 document.getelementsbytagname tag...