909422229 Jquery常用選擇器大全

2021-08-01 08:24:54 字數 4221 閱讀 3965

請使用我們的 jquery 選擇器檢測器 來演示不同的選擇器。

選擇器例項選取*

$("*")

所有元素

#id$("#lastname")

id="lastname" 的元素

.class

$(".intro")

class="intro" 的所有元素

.class,.class

$(".intro,.demo")

class 為 "intro" 或 "demo" 的所有元素

element

$("p")

所有 元素

el1,el2,el3

$("h1,div,p")

所有 、和 元素

:first

$("p:first")

第乙個 元素

:last

$("p:last")

最後乙個 元素

:even

$("tr:even")

所有偶數 元素

:odd

$("tr:odd")

所有奇數 元素

:first-child

$("p:first-child")

屬於其父元素的第乙個子元素的所有 元素

:first-of-type

$("p:first-of-type")

屬於其父元素的第乙個 元素的所有 元素

:last-child

$("p:last-child")

屬於其父元素的最後乙個子元素的所有 元素

:last-of-type

$("p:last-of-type")

屬於其父元素的最後乙個 元素的所有 元素

:nth-child(n)

$("p:nth-child(2)")

屬於其父元素的第二個子元素的所有 元素

:nth-last-child(n)

$("p:nth-last-child(2)")

屬於其父元素的第二個子元素的所有 元素,從最後乙個子元素開始計數

:nth-of-type(n)

$("p:nth-of-type(2)")

屬於其父元素的第二個 元素的所有 元素

:nth-last-of-type(n)

$("p:nth-last-of-type(2)")

屬於其父元素的第二個 元素的所有 元素,從最後乙個子元素開始計數

:only-child

$("p:only-child")

屬於其父元素的唯一子元素的所有 元素

:only-of-type

$("p:only-of-type")

屬於其父元素的特定型別的唯一子元素的所有 元素

parent > child

$("div > p")

元素的直接子元素的所有 元素

parent descendant

$("div p")

元素的後代的所有 元素

element + next

$("div + p")

每個 元素相鄰的下乙個 元素

element ~ siblings

$("div ~ p")

元素同級的所有 元素

:eq(index)

$("ul li:eq(3)")

列表中的第四個元素(index 值從 0 開始)

:gt(no)

$("ul li:gt(3)")

列舉 index 大於 3 的元素

:lt(no)

$("ul li:lt(3)")

列舉 index 小於 3 的元素

:not(selector)

$("input:not(:empty)")

所有不為空的輸入元素

:header

$(":header")

所有標題元素 , ...

:animated

$(":animated")

所有動畫元素

:focus

$(":focus")

當前具有焦點的元素

:contains(text)

$(":contains('hello')")

所有包含文字 "hello" 的元素

:has(selector)

$("div:has(p)")

所有包含有 元素在其內的 元素

:empty

$(":empty")

所有空元素

:parent

$(":parent")

所有是另乙個元素的父元素的元素

:hidden

$("p:hidden")

所有隱藏的 元素

:visible

$("table:visible")

所有可見的**

:root

$(":root")

文件的根元素

:lang(language)

$("p:lang(de)")

所有帶有以 "de" 開頭的 lang 屬性值的 元素

[attribute]

$("[href]")

所有帶有 href 屬性的元素

[attribute=value]

$("[href='default.htm']")

所有帶有 href 屬性且值等於 "default.htm" 的元素

[attribute!=value]

$("[href!='default.htm']")

所有帶有 href 屬性且值不等於 "default.htm" 的元素

所有帶有 href 屬性且值以 ".jpg" 結尾的元素

[attribute|=value]

$("[title|='tomorrow']")

所有帶有 title 屬性且值等於 'tomorrow' 或者以 'tomorrow' 後跟連線符作為開頭的字串

[attribute^=value]

$("[title^='tom']")

所有帶有 title 屬性且值以 "tom" 開頭的元素

[attribute~=value]

$("[title~='hello']")

所有帶有 title 屬性且值包含單詞 "hello" 的元素

[attribute*=value]

$("[title*='hello']")

所有帶有 title 屬性且值包含字串 "hello" 的元素

:input

$(":input")

所有 input 元素

:text

$(":text")

所有帶有 type="text" 的 input 元素

:password

$(":password")

所有帶有 type="password" 的 input 元素

:radio

$(":radio")

所有帶有 type="radio" 的 input 元素

:checkbox

$(":checkbox")

所有帶有 type="checkbox" 的 input 元素

:submit

$(":submit")

所有帶有 type="submit" 的 input 元素

:reset

$(":reset")

所有帶有 type="reset" 的 input 元素

:button

$(":button")

所有帶有 type="button" 的 input 元素

:image

$(":image")

所有帶有 type="image" 的 input 元素

:file

$(":file")

所有帶有 type="file" 的 input 元素

:enabled

$(":enabled")

所有啟用的 input 元素

:disabled

$(":disabled")

所有禁用的 input 元素

:selected

$(":selected")

所有選定的 input 元素

:checked

$(":checked")

所有選中的 input 元素

909422229 物件導向

物件導向三要素 封裝 encapsulation 繼承 inheritance 多型 polymorphism 物件導向五原則 單一職責原則 srp 開放 封閉原則 ocp liskov替換原則 lsp 依賴倒置原則 dip 介面隔離原則 isp 物件導向六視點 復用 reusibility 擴充套...

909422229 Web分頁技術

下面分享一下web網頁的分頁技術,次教程在jsp網頁上實現,次教程也是新手學習,僅供參考!由於是新手學習資料,會詳細說明 1.首先基本的不再提,資料庫多條資料,jsp頁面,資料層分別是查詢資料總條數與業務層呼叫一下。2.主要是pageservlet 暫且叫 頁面的邏輯結構,由於返回的資料層返回了資料...

909422229 Excel匯入匯出實現

最近做了關於excel匯入匯出的功能,下面記錄一下這兩天的事。方便今後的學習。如果有其他部落格朋友參考的話需要謹慎,因為公司有自己封裝jar包,你們是用不到的。哈哈 先說匯入 思路 現將匯入模板 檔案 上傳到伺服器上,之後伺服器進行讀取檔案資訊,將資訊寫入資料庫後將檔案刪除。後說匯出 下面是前台js...