读jQuery官方文档：jQuery对象

时间：2024-05-22 20:36:50

jQuery对象

当用$符号包裹一个CSS风格选择器的时候，你得到一个jQuery对象。

var heading = $('h1');

jQuery对象是对DOM ELement封装过后的数组。注意，无论选择器匹配了多个或者零个元素，jQuery对象都不再是false。意味着你只能够用jQuery对象的.length属性来判断选择器是否选中了元素。

if ($('h1')) {

	//do something

}

如果我想要得到页面中第一个匹配的元素呢？

var headings = $('h1');

var firstHeading = headings.eq(0);

.eq(0)返回第一个匹配元素的jQuery对象。如果你想要原生的DOM对象，你可以

var headings = $('h1');

firstHeadingElem = headings.get(0);

或者

var firstHeadingElem = $('h1')[0];

鉴于jQuery对象和DOM对象是有区别的，所以在命名的时候最好是区分好两者，可以使用$符号前缀来表示jQuery对象：

var elem = document.getElementById('exmaple');

var $elem = $('#example');

另外需要记住的是，由于每次调用$()的时候，都会在内存中生成新的独立的jQuery对象，所以，「Not all jQuery Objects created equally.」

var $heading1 = $('h1');

var $heading2 = $('h1');

alert($heading1 === $heading2);  //false

即使两个jQuery对象的内容是相同的，也不意味这他们是同一个对象（物理地址不一样）。

但是，可以获取到他们都包含着的相同的DOM对象：

var $logo1 = $('#logo');

var logoElem1 = $logo1.get(0);

var $logo2 = $('#logo');

var logoElem2 = $logo2.get(0);

alert(logoElem1 === logoElem2);   //true

最后，jQuery对象不是「活」的。jQuery对象生成的时候，它成为了一个封装过的选择器匹配结果的「快照」。也就是说，在jQuery对象生成后，对相关元素做出了改变不会反映到jQuery对象上。

var $p = $('p');

在$p声明之后，对页面p元素的作出任何修改（remove、update）都不会影响到$p这个jQuery对象。如果想要更新这个jQuery呢？可以重新生成一个：

$p = $('p');

相关文章