JQuery獲取 this 子節點物件的方法

2021-06-07 13:33:01 字數 898 閱讀 5172

相信很多剛接觸jquery的人,很多都會對$(this)和this的區別模糊不清,那麼這兩者有什麼區別呢?

首先來看看jquery中的  $()  這個符號,實際上這個符號在jquery中相當於jquery(),即$(this)=jquery();也就是說,這樣可以返回乙個jquery物件。那麼,當你在網頁中alert($('#id'));時,會彈出乙個[object object ],這個object物件,也就是jquery物件了。

那麼,我們再回過頭來說$(this),這個this是什麼呢?假設我們有如下的**:

$("#desktop a img").each(function(index)

那麼,這時候可以看出來:

alert($(this));  彈出的結果是[object object ]

alert(this);        彈出來的是[object htmlimageelement]

也就是說,後者返回的是乙個html物件(本例中是遍歷html的img物件,所以為 htmlimageelement)。很多人在使用jquery的時候,經常this.attr('src');   這時會報錯「物件不支援此屬性或方法」,這又是為什麼呢?其實看明白上面的例子,就知道錯在**了:

很簡單,this操作的是html物件,那麼,html物件中怎麼會有val()方法了,所以,在使用中,我們不能直接用this來直接呼叫jquery的方法或者屬性。

明白了$(this)和this的區別,再來看看這個例子:(假設,我的頁面中a標籤包含img,並含有src屬性),當我在遍歷的時候,想取到$(this)下img中src的位址

$("#desktop a ").each(function(index)

其中 .find(element) 是返回乙個用於匹配元素的dom元素,這樣就可以取到想要的src位址了

jQuery獲取父 兄 子 節點

jquery.parent expr 找父親節點,可以傳入expr進行過濾,比如 span parent 或者 span parent class jquery.parents expr 類似於jquery.parents expr 但是是查詢所有祖先元素,不限於父元素 jquery.childre...

jQuery獲取節點和子節點文字

對於下面的html片段,test texttechbrood co.獲取節點純文字 var text text test text 這個會得到 test text techbrood co.也就是會把當前元素的所有節點 包含子節點 的文字讀取出來。如果只想獲取主節點的文字,方法複雜點 var tex...

jquery獲取子節點父節點的方法

一 獲取子節點 比如是乙個 id 為 test 的 div元素,我們這樣選中,test 我們要查詢這個div下的乙個class為demo的span元素,有一下幾種方法 1 使用篩選條件 test span.demo 2 使用find 函式 test find span.demo 3 使用childr...