初學jQuery之選擇器

2021-09-13 11:10:47 字數 2167 閱讀 8709

jquery的選擇器是用於定位html頁面中的元素,其用法最初設計是源於css的選擇其用法,但是jquery的選擇器進行了擴充套件,遠比css的選擇器更加強大。

基本選擇去具有以下幾種:

1.id選擇器

2.元素選擇器

3.類選擇器

4.萬用字元選擇器

5.組合選擇器

示例**如下:

臥龍學苑

前端開發

jquery的層級選擇器具有以下幾種:

1.後代選擇器 根據給定元素的祖先元素下匹配所有的後代元素

2.子選擇器 根據給定的父元素下匹配所有的子元素

3.相鄰兄弟選擇器 根據給定的目標元素匹配下乙個相鄰兄弟元素

4.普通兄弟選擇器 根據給定的目標元素匹配後面所有兄弟元素

由於jquery物件是類陣列物件,及時匹配的元素只有乙個,返回的結果依舊是類陣列物件。

示例**如下:

jquery的基本過濾選擇器具有以下幾種:

1.:first過濾選擇器 獲取第乙個元素

2.:last過濾選擇器 獲取最後乙個元素

3.:even過濾選擇器 匹配所有索引值為偶數的元素,從0開始

4.:odd過濾選擇器 匹配所有索引值為奇數的元素,從0開始

5.:eq()過濾選擇器 匹配乙個給定索引值的元素

6.:gt()過濾選擇器 匹配所有大於給定索引值的元素

7.:lt()過濾選擇器 匹配所有小於給定索引值的元素

8.:not()過濾選擇器 去除所有與給定選擇器匹配的元素

9.:header過濾選擇器 匹配如h1 h2 h3 h4 h5 h6之類的標題元素

10.:animated過濾選擇器 匹配正在執行動畫效果的元素(由jquery實現的動畫)

示例**如下:

臥龍學苑

前端開發

jquery中提供了以下幾種內容過濾選擇器

1.:contains()過濾選擇器 匹配包含給定位版本的元素

2.:empty過濾選擇器 匹配不包含子元素或者文字的空元素

3.:parent過濾選擇器 匹配有子元素或者文字的元素

4.:has()過濾選擇去 匹配含有選擇器所匹配的元素的元素

示例**如下:

這是div元素

1.:hidden過濾選擇器 匹配所有不可見元素,或者type為hidde的元素

2.:visible過濾器選擇器 匹配所有可見的元素

臥龍學苑

前端開發

1.[attr]過濾選擇器 匹配包含給定屬性的元素

2.[attr=value]過濾選擇器 匹配給定的屬性是某個特定值的元素

3.[attr!=value]過濾選擇器 匹配不含有特定的屬性,或者屬性不等於特定值的元素

4.[attr^=value]過濾選擇器 匹配給定的屬性是以某些值開始的元素

5.[attr$=value]過濾選擇器 匹配給定的屬性是以某些值結尾的元素

6.[attr*=value]過濾選擇器 匹配給定的屬性是包含某些值的元素

7.組合過濾選擇器 匹配元素需要同時滿足多個屬性過濾器

1.:nth-child()過濾選擇器 匹配其父元素下的第n個子或奇偶元素

2.:first-child過濾選擇器 匹配第乙個子元素

3.:last-child過濾選擇器 匹配最後乙個子元素

4.:only-child過濾選擇器 如果某個元素是父元素中唯一的子元素,就會被匹配

這是id為d1的div元素

這是id為d2的div元素

這是id為d3的div元素

1.:enabled過濾選擇器 匹配所有可用元素

2.:disabled過濾選擇器 匹配所有不可用元素

3.:checked過濾選擇器 匹配所有選中的被選中元素

4.:selected過濾選擇器 匹配所有選中的元素

初學 jQuery樣式 選擇器。

前言 做web開發的我們,需要對頁面進行美化,我們不僅要學會如何設計頁面布局頁面,還要學會給頁面標籤新增各種各樣樣式讓使用者有極好的體驗感。一,jquery對樣式的操作。1.設定獲採樣式css 引入jquery jar包 函式入口 function 2.設定樣式 set click function...

jQuery選擇器之全選擇器( 選擇器)

在css中,經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery,如果要獲取文件中所有的元素,通過document.getelementsbytagname 中傳遞 同樣可以獲取到 不難發現...

jQuery選擇器之全選擇器(選擇器)

jquery選擇器之全選擇器 選擇器 在css中,經常會在第一行寫下這樣一段樣式 萬用字元 意味著給所有的元素設定預設的邊距。jquery中我們也可以通過傳遞 選擇器來選中文件頁面中的元素 描述 拋開jquery,如果要獲取文件中所有的元素,通過document.getelementsbytagna...