有没有一种快速的方法来围绕数组中的每个元素包装jQuery?

时间:2013-05-16 09:09:41

标签: jquery

这可以用更简洁的方式完成吗?

var src = $('div');
var dest = [];

for ( var i = 0; i < src.length; i++)
    dest[i] = $(src[i]);

我只能想到这一点,这仍然非常冗长:

var dest = [];
$('div').each(function() { dest.push($(this)); });

jQuery是否为这种情况提供了更好的解决方案?我找不到了。


要解决评论中的一些反复出现的问题:

  

src[i]已经是一个jQuery对象,调用jQuery(src[i])没有做任何事情。

不,它是一个普通的DOM节点,根本没有任何jQuery包装。

  

出于好奇,为什么要这样做?

因为之后我需要分别对每个元素做很多事情。例如,我需要遍历所有这些以找到最高的一个,然后将其余的设置为相同的高度。之后,我需要获得所有宽度并基于此进行一些布局(因此每个元素根据其他元素的宽度获得其x&amp; y坐标)。等

如果我可以使用jQuery提供的速记函数,所有这些操作都更容易完成,但这意味着我需要单独包装每个元素($('div')只返回所有的包装器>他们)。因为我需要多次访问每个元素,所以我想通过将每个元素包装一次而不是每次访问来提高性能。

2 个答案:

答案 0 :(得分:8)

这正是map()的用途。 您循环遍历每个元素并将一个函数应用于该元素并将其推送到一个新的数组。

var wrapped  = $.map($('div'), function(){ return $(this); });

或为了便于阅读

var wrapped  = $.map($('div'), function(val, i) {
    return $(val);
});

答案 1 :(得分:1)

您不应该将dom节点重新转换为jQuery对象。

你应该尝试这样的事情,

var src = $('div');
var dest = [];

for ( var i = 0, l = src.length; i < l; i++) {
    dest[i] = src.eq(i);
}

console.log(dest);

甚至更好,

var src = document.getElementsByTagName('div');
var dest = [];
for ( var i = 0, l = src.length; i < l; i++) {
    dest[i] = $(src[i]);
}
console.log(dest);


我不是很擅长js perf,但这是一个测试http://jsperf.com/eq-vs-vs-vanilla