DOM對象是我們用傳統(tǒng)的方法(javascript)獲得的對象虑稼,jQuery對象就是用jQuery的類庫選擇器獲得的對象讨跟。JQuery對象就是通過jQuery包裝DOM對象后產(chǎn)生的對象。JQuery對象是jQuery獨(dú)有的易猫,其可以使用jQuery里的方法耻煤,但是不能使用DOM的方法。
1. console.log($('p') instanceof jQuery);
2. console.log($('p'));
我們試著運(yùn)行一下准颓,結(jié)果如下:
結(jié)果
可以看到违霞,jQuery對象實(shí)際上是一個數(shù)組,它是由全局對象jQuery構(gòu)造出來的瞬场,由上方第一行代碼可以看到买鸽。
相互轉(zhuǎn)換
DOM對象轉(zhuǎn)換為jQuery對象
var p = document.getElementById('demo');
console.log(p);
console.log($(p));
jQuery對象轉(zhuǎn)換為DOM對象
jQuery對象[index]
沒錯,就是這么簡單贯被,使用下標(biāo)去訪問即可眼五,代碼驗(yàn)證。
console.log($('p')[0]);
輸出結(jié)果:
jQuery的each方法
概述
以每一個匹配的元素作為上下文來執(zhí)行一個函數(shù)彤灶。
意味著看幼,每次執(zhí)行傳遞進(jìn)來的函數(shù)時,函數(shù)中的this關(guān)鍵字都指向一個不同的DOM元素(每次都是一個不同的匹配元素)幌陕。而且诵姜,在每次執(zhí)行函數(shù)時,都會給函數(shù)傳遞一個表示作為執(zhí)行環(huán)境的元素在匹配的元素集合中所處位置的數(shù)字值作為參數(shù)(從零開始的整型)搏熄。 返回 'false' 將停止循環(huán) (就像在普通的循環(huán)中使用 'break')棚唆。返回 'true' 跳至下一個循環(huán)(就像在普通的循環(huán)中使用'continue')。
注意
給each方法傳入一個函數(shù)心例,則函數(shù)的環(huán)境綁定到每一個DOM對象宵凌,測試如下:
$('p').each(function(){
console.log(this);
});
結(jié)果
可以看到,this自動綁定到每一個p元素上止后,這里的this是DOM對象瞎惫,不能使用jQuery方法,如果需要轉(zhuǎn)變?yōu)閖Query對象译株,那么就使用
$(this)
吧瓜喇。
使用$(this)的結(jié)果