Question

假设我获得了$(".box")之类的项目列表。是否有可能获得索引的jQuery对象

喜欢

var $boxes = $(".box"),
    $box2 = $boxes[1]

目前我做的事情

var $boxes = $(".box");
$boxes.each(function(i, box) {
    var $box = $(box); // <-- is this a good idea?
    // do something with $box
});

我不知道行var $box = $(box)是否是个好主意？我实际上是在setInterval()

中运行它

像

var $boxes = $(".box");
setInterval(function() {
    $boxes.each(function(i, box) {
        var $box = $(box); // <-- is this a good idea?
        // do something with $box
    });
}, 1000);

我想知道它是否对性能有害，因为我在本例中为每{1}}中的每个项初始化一个变量。如果我可以直接从jQuery“数组”或任何$ box中访问元素，那么它可能更好吗？

Answer 1

目前还不完全清楚你的问题是什么，但是jQuery对象已经类似于数组，你可以在它们上使用[]运算符。你得到的是该索引的原始DOM对象，所以：

var $boxes = $(".box"),
    box2 = $boxes[1],   // `box2` is a raw DOM object
    $box2 = $(box2);    // `$box2` is a jQuery wrapper around the second box

关于此代码：

var $boxes = $(".box");
setInterval(function() {
    $boxes.each(function(i, box) {
        var $box = $(box); // <-- is this a good idea?
        // do something with $box
    });
}, 1000);

如果您确实需要这样做（例如，如果您确实需要围绕该特定条目的jQuery包装器），那么这样做很好。它是使得浏览器每次间隔计时器触发时都能正常工作（因为$()不是免费的，虽然它也不是昂贵的），所以如果列表很简单，您可以通过在元素上预先创建jQuery包装器来交换CPU时间以用于内存：

var $wrapped = [];
$(".box").each(function() {
    $wrapped.push($(this));
});
setInterval(function() {
    $.each($wrapped, function(i, $box) {
        // do something with $box
    });
}, 1000);

Answer 2

你可以根据你的例子迭代jQuery元素，没有错。为每个元素var $box = $(box);创建局部变量是个好主意。

您还可以使用eq方法访问jQuery对象的元素，例如：

var $boxes = $(".box"),
$box2 = $boxes.eq(1);

这样你就不需要通过$ constructor传递元素了。

Answer 3

如果你想要一个更快更有效的循环元素的方法，同时还有一个jQuery包装器，请查看Ben Alman的“each2”插件：

http://benalman.com/projects/jquery-misc-plugins/#each2

然后你可以替换这段代码：

$boxes.each(function(i, box) {
    var $box = $(box);
    // do something with $box
});

有了这个：

$boxes.each2(function(i, $box) {
    // do something with $box
});

Answer 4

旁注，

var $boxes = $(".box");
setInterval(function() {
    $boxes.each(function(i, box) {
        var $box = $(box);
        // do something with $box
    });
}, 1000);

相当于

var $boxes = $(".box");
setInterval(function() {
    $boxes.each(function() {
        var $box = $(this);
        // do something with $box
    });
}, 1000);

Answer 5

'i'在每个回调函数中都是索引。但我不推荐它。只需在当前元素的每个函数内调用'this'即可。

var $ box = this;

Answer 6

如果你只需要方框3：

$('.box:eq(3)').doStuff();

无论如何从$（“。box”）获取索引项

6 个答案: