jquery this與$(this)的區別

jquery this與$(this)的差別是：1、this是html元素，而$this只是個變數名，加$是為了說明其是個jquery物件；2、$(this)是個轉換，可用來將this表示的dom物件轉換為jquery物件。

本教學操作環境：Windows7系統、jquery1.10.0版，Dell G3電腦。

推薦：《jquery影片教學》

JQuery this和$(this)的差異及取得$(this)子元素物件的方法

1.JQuery this和$(this)的區別

 // this其实是一个Html 元素。
 
 // $this 只是个变量名，加$是为说明其是个jquery对象。
 
 // 而$(this)是个转换，将this表示的dom对象转为jquery对象，这样就可以使用jquery提供的方法操作。

相信很多剛接觸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));
            alert(this);
}

那麼，這時候可以看出來：

alert($(this));  弹出的结果是[object Object ]
alert(this);        弹出来的是[object HTMLImageElement]

也就是說，後者傳回的是一個html物件(本例中是遍歷HTML的img對象，所以為HTMLImageElement)。

很多人在使用jquery的時候，經常this.attr('src');   這時會報錯“物件不支援此屬性或方法”，這又是為什麼呢？其實看懂上面的例子，就知道錯在哪裡了：很簡單，this操作的是HTML對象，那麼，HTML對像中怎麼會有val()方法了，所以，在使用中，我們不能直接用this來直接呼叫jquery的方法或屬性。

2.取得$(this)子節點物件的方法：find(element)

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

      $("#desktop a ").each(function(index){
         var imgurl=$(this).find('img').attr('src');
         alert(imgurl);
        }

其中.find(element) 是回傳一個用來符合元素的DOM元素，這樣就可以取到想要的src位址了。

以上是jquery this與$(this)的區別的詳細內容。更多資訊請關注PHP中文網其他相關文章！