jQuery之基本選擇器

2022-05-06 13:21:11 字數 1434 閱讀 4280

1. 是什麼?

- 有特定格式的字串

2. 作用

- 用來查詢特定頁面元素

3. 基本選擇器

- #id : id選擇器

- element : 元素選擇器

- .class : 屬性選擇器

- * : 任意標籤

- selector1,selector2,selectorn : 取多個選擇器的並集(組合選擇器)

- selector1selector2selectorn : 取多個選擇器的交集(相交選擇器)

現有如下需求:

/*需求:

1. 選擇id為div1的元素

2. 選擇所有的div元素

3. 選擇所有class屬性為box的元素

4. 選擇所有的div和span元素

5. 選擇所有class屬性為box的div元素(div.box),如果屬性不是id和class,就需要用div【name=「」】來表示

*/

<

div

id="div1"

class

="box"

>div1(class="box")

div>

<

div

id="div2"

class

="box"

>div2(class="box")

div>

<

div

id="div3"

>div3

div>

<

span

class

="box"

>span(class="box")

span

>

<

br>

<

ul>

<

li>aaaaa

li>

<

li title

="hello"

>bbbbb(title="hello")

li>

<

li class

="box"

>ccccc(class="box")

li>

<

li title

="hello"

>dddddd(title="hello")

li>

ul>

通過js實現:

console.log($("#div1").get(0).innerhtml);

console.log($("div").length);

console.log($(".box").html());

console.log($("div,span").html());

console.log($("div[class='box']").html());

jQuery選擇器之基本篩選選擇器

很多時候我們不能直接通過基本選擇器與層級選擇器找到我們想要的元素,為此jquery提供了一系列的篩選選擇器用來更快捷的找到所需的dom元素。篩選選擇器很多都不是css的規範,而是jquery自己為了開發者的便利延展出來的選擇器 篩選選擇器的用法與css中的偽元素相似,選擇器用冒號 開頭,通過乙個列表...

jQuery選擇器之基本選擇器(1)

基本選擇器主要有五種 分別為 id選擇器 class選擇器 element 選擇器 選擇器和組合選擇器。1 id選擇器 根據id查詢標籤物件 2 element選擇器 根據標籤名查詢標籤物件 3 class選擇器 根據class查詢標籤物件 4 選擇器 表示任意的,所有的元素 5 組合選擇器 合併多...

Jquery選擇器 基本選擇器

jquery作為我們常用前端工具之一,實際專案中常用的的選擇器有id選擇器 id 元素選擇器 element 樣式選擇器 class 概述 根據給定的id匹配乙個元素。使用任何的元字元 如 作為名稱的文字部分,它必須被兩個反斜槓轉義 引數 id,用於搜尋的,通過元素的 id 屬性中給定的值。示例 查...