jQuery元素選擇器(element)

2021-07-30 10:36:17 字數 1270 閱讀 8354

一 介紹

元素選擇器是根據元素名稱匹配相應的元素。

通俗的講元素選擇器指向的是dom元素的標記名,也就是說元素選擇器是根據元素的標記名選擇的。

可以把元素的標記名理解成學生的姓名,在乙個學校中可能有多個姓名為「劉偉」的學生,但是姓名為「吳語」的學生也許只有乙個,所以通過元素選擇器匹配到的元素可能有多個,也可能是乙個。

多數情況下,元素選擇器匹配的是一組元素。

元素選擇器的使用方法如下: 

$("element");

其中,element為要查詢元素的標記名。

例如,要查詢全部div元素,可以使用下面的jquery**: 

$("div");

二 應用

在頁面中新增兩個標記和乙個按鈕,通過單擊按鈕來獲取這兩個,並修改它們的內容。

三 **

這裡種植了一棵士多啤梨

這裡養殖了一條魚

四 執行效果

五 執行說明

在上面的**中,使用元素選擇器獲取了一組div元素的jquery包裝集,它是一組object物件,儲存方式為[object object],但是這種方式並不能顯示出單獨元素的文字資訊,需要通過索引器來確定要選取哪個div元素,在這裡分別使用了兩個不同的索引器eq()和get()。

這裡的索引器類似於房間的門牌號,所不同的是,門牌號是從1開始計數的,而索引器是從0開始計數的。

在本例項中使用了兩種方法設定元素的文字內容,html()方法是jquery的方法,innerhtml方法是dom物件的方法。

這裡還用了$(document).ready()方法,當頁面元素載入就緒的時候就會自動執行程式,自動為按鈕繫結單擊事件。

eq()方法返回的是乙個jquery包裝集,所以它只能呼叫jquery的方法,而get()方法返回的是乙個dom物件,所以它只能用dom物件的方法。

eq()方法與get()方法預設都是從0開始計數。

$("#test").get(0)等效於$("#test")[0]。

大小: 1.5 kb

大小: 1.4 kb

JQuery元素選擇器

1.基本選擇器 標籤選擇器 元素選擇器 語法 html標籤名 獲得所有匹配標籤名稱的元素 id選擇器 語法 id的屬性值 獲得與指定id屬性值匹配的元素 類選擇器 語法 class的屬性值 獲得與指定的class屬性值匹配的元素 並集選擇器 語法 選擇器1,選擇器2.獲取多個選擇器選中的所有元素 2...

jQuery選擇器選擇dom元素

jquery選擇器其實是乙個有些地方比較費解的,如果沒有經過多次實驗的話,很難得出它的每個操作符到底是幹什麼的,很容易出錯,經過我的多次測試,終於對一些比較難理解或容易出錯的選擇操作進行總結,既方便自己將來查詢又方便初學者學習。如果 有不對的還望大家幫我指出來,這裡是乙個相互學習的地方。1.先說說通...

jQuery選擇器之子元素篩選選擇器

子元素篩選選擇器不常使用,其篩選規則比起其它的選擇器稍微要複雜點 子元素篩選選擇器描述表 注意事項 first只匹配乙個單獨的元素,但是 first child選擇器可以匹配多個 即為每個父級元素匹配第乙個子元素。這相當於 nth child 1 last 只匹配乙個單獨的元素,last child...