javascript - 无论如何，从 $ (".box"获取索引项)

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 秒为 $boxes 中的每个项目初始化一个变量。如果我可以直接从 jQuery“数组”或任何 $boxes 访问该元素，可能会更好？

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);