JQuery this和$(this)的区别及获取$(this)子元素对象的方法
1.JQuery this和$(this)的區(qū)別
// this其實(shí)是一個(gè)Html 元素。 // $this 只是個(gè)變量名,加$是為說明其是個(gè)jquery對(duì)象。 // 而$(this)是個(gè)轉(zhuǎn)換,將this表示的dom對(duì)象轉(zhuǎn)為jquery對(duì)象,這樣就可以使用jquery提供的方法操作。 相信很多剛接觸JQuery的人,很多都會(huì)對(duì)$(this)和this的區(qū)別模糊不清,那么這兩者有什么區(qū)別呢??????? 首先來看看JQuery中的? $()? 這個(gè)符號(hào),實(shí)際上這個(gè)符號(hào)在JQuery中相當(dāng)于JQuery(),即$(this)=jquery();也就是說,這樣可以返回一個(gè)jquery對(duì)象。那么,當(dāng)你在網(wǎng)頁(yè)中alert($('#id'));時(shí),會(huì)彈出一個(gè)[object Object ],這個(gè)object對(duì)象,也就是jquery對(duì)象了。
?????? 那么,我們?cè)倩剡^頭來說$(this),這個(gè)this是什么呢?假設(shè)我們有如下的代碼:
$("#desktop a img").each(function(index){
??????? ??? alert($(this));
????????? ? alert(this);
}
那么,這時(shí)候可以看出來:
alert($(this));? 彈出的結(jié)果是[object Object ]
alert(this);??????? 彈出來的是[object HTMLImageElement]
也就是說,后者返回的是一個(gè)html對(duì)象(本例中是遍歷HTML的img對(duì)象,所以為HTMLImageElement)。
很多人在使用jquery的時(shí)候,經(jīng)常this.attr('src');?? 這時(shí)會(huì)報(bào)錯(cuò)“對(duì)象不支持此屬性或方法”,這又是為什么呢?其實(shí)看明白上面的例子,就知道錯(cuò)在哪里了:很簡(jiǎn)單,this操作的是HTML對(duì)象,那么,HTML對(duì)象中怎么會(huì)有val()方法了,所以,在使用中,我們不能直接用this來直接調(diào)用jquery的方法或者屬性。
?
2.獲取$(this)子節(jié)點(diǎn)對(duì)象的方法:find(element)
明白了$(this)和this的區(qū)別,再來看看這個(gè)例子:(假設(shè),我的頁(yè)面中a標(biāo)簽包含img,并含有src屬性),當(dāng)我在遍歷的時(shí)候,想取到$(this)下img中src的地址
? ? ? $("#desktop a ").each(function(index){
???????? var imgurl=$(this).find('img').attr('src');
???????? alert(imgurl);
??????? }
其中 .find(element) 是返回一個(gè)用于匹配元素的DOM元素,這樣就可以取到想要的src地址了。
?
?
---------------------------------------------------------------------------------------------------------------
this 與 $(this) 是不一樣的對(duì)象this指針表示的是當(dāng)前function中的context對(duì)象,
在 jQuery 事件中:
- this 表示的是當(dāng)前事件發(fā)生的目標(biāo)元素(DOM對(duì)象)
- $(this) 表示將該元素封裝為一個(gè) jQuery 對(duì)象
例如
$( "p" ).bind() 中的 this 就是一個(gè) p 元素,它是DOM對(duì)象,擁有的屬性和方法都是DOM對(duì)象的屬性和方法。
$(this)則是將這個(gè)p元素封裝為一個(gè)jQuery對(duì)象,從而可以使用jQuery定義的一些方法來訪問DOM對(duì)象。
$(this).text() 方法屬于jQuery對(duì)象,作用是取得元素的文本內(nèi)容,與之對(duì)應(yīng)的DOM對(duì)象屬性是 this.textContent
同樣,$(this).html() 是取得元素內(nèi)的HTML內(nèi)容,對(duì)應(yīng)的是 this.innerHTML。
而 this.nodeName 則沒有對(duì)應(yīng)的jQuery方法了。
?
?
總結(jié)
以上是生活随笔為你收集整理的JQuery this和$(this)的区别及获取$(this)子元素对象的方法的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
 
                            
                        - 上一篇: 交换机的基本交换配置
- 下一篇: Bash数组操作教程
