選擇器竟然有這麼多!!!w w

2021-08-10 21:29:52 字數 1911 閱讀 4625

慚愧⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄,做了這麼長時間的前端(其實也就半年多吧哈哈),平時用到的選擇器都是id、類、標籤,最多用到屬性和子選擇器,到今天才知道平時用到的這些都是css選擇器,竟然還有jq選擇器,css選擇器和jq選擇器之間竟然還有這麼多區別,彷彿發現了寶藏,啊哈哈~<( ̄▽ ̄)/,廢話不多說,經過一番查閱資料,自己總結如下,如有錯誤,歡迎指正,ok,言歸正傳(嚴肅臉(っ•̀ω•́)っ✎⁾⁾ )

平時我們用jquery包裝過的選擇器都可以稱之為jq選擇器,jq選擇器種類非常多,可分為基本選擇器和過濾選擇器兩大類:

基本選擇器

css選擇器:id($(『#id』))

類($(『.class』))

標籤($(『div』))

萬用字元($(『*』))

集合($(『div1,div2,…,div』));

層次選擇器:

後代($(『div p』))[父元素下的所有相關元素,包括子和孫子]

子選擇器($(『div>p』))[只能選擇到子元素]

緊鄰($(『div+p』))[緊接在div元素後的第乙個p元素]

兄弟($(『div~p』))[div後面所有的p元素]

表單域選擇器:(:input、:text、:password、:radio、:file、:checkbox…)

過濾選擇器

1. 根據索引值對元素進行篩選:

:first($(『td:first』))[選擇第乙個匹配元素]

:last、:odd、:even

:eq(index)[從匹配的集合中選擇索引符合給定值的元素]

:gt(index)[從匹配的集合中選擇索引大於給定值的元素]

:lt(index)[從匹配的集合中選擇索引小於給定值的元素]

:not(:first,:last,p)[從匹配的集合中出去給定的元素]

$(『:header』)[選擇類似於h1,h2之類的標題]

2.內容過濾:

$(『selector:contains(text)』)[包含指定文字]

$(『selector1:has(selector2)』)[包含給定子元素]

$(『selector:empty『)[不包含子元素或文字的所有空元素]

$(『selector:parent『)[包含子元素或文字的元素,與empty相反]

3.屬性過濾

$(『selector[attribute]』)、$(『selector[attribute=value]』)、$(『selector[attribute*=value]』)[屬性包含給定子字串]…

4.子元素過濾

$(『selector:first-child『)

$(『selector:last-child『)

$(『selector:nth-child『)

5.表單

$(『selector:checked『)[所有被選中的表單域]

$(『selector:enabled/disabled『)[所有可用/不可用的表單域]

$(『selector:selected『)[所有被選中的option]

6.可見性

$(『selector:hidden『)[所有不可見元素]

$(『selector:visible『)[所有可見元素]

手機裡竟然有這麼多感測器!終於都搞懂了

隨著技術的進步,手機已經不再是乙個簡單的通訊工具,而是具有綜合功能的可攜式電子裝置。手機的虛擬功能,比如互動 遊戲 都是通過處理器強大的計算能力來實現的,但與現實結合的功能,則是通過感測器來實現。本文就為大家整理了手機中常見的感測器,幫助大家了解其原理和用途。一 光線感測器 原理 光敏三極體,接受外...

竟然修改形參有這麼可怕的後果!!

今天在知乎上 ihu.com question 24692840 answer 345252713看到為預設形參的處理辦法 function fun name 如果呼叫這個函式時沒有傳入實參,則name就是undefined,這樣name就會被賦 join 這個值,這樣不久皆大歡喜了嗎?事實是沒你想...

選擇器要這麼用!!!!66666

選擇器主要用於選擇標籤.基本用法是同css的選擇器.但是,很讓人興奮的是,他支援常見的瀏覽器,而css中很多選擇器是ie6所不支援的.1.基本選擇器 3種 a 標籤名 如 p 是選取了所有的p標籤節點 這個選擇器可以選擇這個頁面中所有的這個標籤 b id名 如 test 是選取了id為test的標籤...