存储JQuery变量可能吗？

Question

我想知道将JQuery选择存储到变量中的是什么.我尝试了下面的例子.

var images = $('div').find('img');
alert($(images[0]).attr('src'));

这有效.但是,如果我使用images [0]而不是$(images [0]),代码将无效.我得出的结论是上面的代码创建了一个包含div img元素的DOM元素的数组.我错过了什么吗？

谢谢

Answer 1

jQuery对象是一个类似于数组的对象.您可以像数组一样访问它(它具有数字属性)并且它有一个.length属性,但它不是一个数组(它不会继承Array.prototype).

当您访问这样的jQuery对象时,即images[0],您将返回一个选定的DOM元素.毕竟,jQuery对象只是DOM元素的集合.

在这种情况下,你可以简单地做

alert(images.attr('src'));

因为images是一个jQuery对象.

不返回jQuery对象的方法通常使用第一个选定元素,因此等效于$(images[0]).attr(...)或images.eq(0).attr(...).

也许你认为链接^{[维基百科]}(即a.b().c())的方法是"神奇的",但事实并非如此.每个方法都返回一个对象,而不是将返回值保存在变量中,您可以立即调用另一个函数.

总结一下:所有选择方法都返回jQuery对象.这些对象是类似于数组的对象.您可以根据需要将它们存储在变量中.

以下所有示例都是等效的:

// 1
$('div').find('img').attr('src');

// 2
var divs = $('div');
divs.find('img').attr('src');

// 3
var images = $('div').find('img');
images.attr('src');

// 4
var divs = $('div');
var images = divs.find('img');
images.attr('src');