jquery - 优化: constructing a jquery collection

Question

我有这个 Jquery 代码，它构造了一个 jquery 对象的集合。执行大约需要 600 毫秒。我想优化它:

var tousBt = $('img.boutonReduire');
var stack = $('');
tousBt.each( function() {
    var id = $(this).attr('id');
    stack = stack.add('#table' + id).add('#img' + id);
  });

你看到我能做些什么吗？结果必须是 jquery 对象的集合。

编辑:我获取所有堆栈元素并隐藏它们:stack.addClass('hideit');大约有 125 个元素。 $('*').length 给出大约 7100 个元素。

Answer 1

首先，删除迭代函数中的赋值操作。 stack 是一个实例——无需重新分配它:

var tousBt = $('img.boutonReduire');
var stack = $('');
tousBt.each( function() {
    var id = $(this).attr('id');
    stack.add('#table' + id).add('#img' + id);
});

如果您多次调用add()，我还建议您避免使用 jQuery 开销。这是使用轻量级数组来累积选择器的版本:

var tousBt = $('img.boutonReduire');
var stack = [];
tousBt.each( function() {
    var id = this.id;
    stack.push('#table' + id);
    stack.push('#img' + id);
});

然后，获取可与 jQuery 一起使用的最终选择器:

var selector = stack.join(','); 
//$(stack.join(','));

编辑:这可能看起来完全迟钝，但这可能实际上是最快的(至少值得一试):

var tousBt = $('img.boutonReduire');
tousBt.each(function() {
    var id = this.id;
    $('#table' + id).addClass('selected');
    $('#img' + id).addClass('selected');
});
var stack = $('.selected');