创建一组jquery对象的最简单方法

Question

是的，我的方式是

   A.add(B).add(C).add(D).show()

虽然A，B，C，D是jQuery对象。我想知道是否有这么简单的方法来做到这一点？ 我尝试了以下所有方法，但没有结果：

$(A,B,C,D).show()
A.add(B,C,D).show()

欢迎所有建议！

---

除了澄清问题外：

部分“.show（）”仅用于演示。我只想知道如何创建一组JQuery对象，如$（'p'）创建一组p标签。

在我的实际案例中，我使用了

$([A,B,C,D]).each(fn)

而不是.show（）（我想知道为什么这有效？） 显然，

$([A,B,C,D]).each(fn)
$('p').each(fn)

两个都工作。但是

$([A,B,C,D]).show()  //--doesn't work
$('p').show()        //--works

只是第二行有效。有谁知道他们之间的差异？ （我只是觉得它们是一样的，然后在我的问题中纠结了一点）

Answer 1

$.each([A,B,C,D], function(){ 
    $(this).css('background','red'); 
})

此解决方案使用名为$.each的jQuery方法，而不是使用选择器，该方法接受一个数组并对其进行迭代。传递的数组是一组jQuery对象。 $(this)引用每次迭代的jQuery对象。

演示： http://jsfiddle.net/SCjMc/1/

---

关于$（）如何运作的其他事实：

$(element)是jQuery(element)的快捷方式。 jQuery()方法接受一组不同的参数：

可以在this link中找到每种参数的说明。

其中一种参数是“elementArray”。对此的描述是：

  

elementArray 一个数组，包含一组要包装在jQuery对象中的DOM元素。

问题是当你使用jQuery选择一个元素时，它会直接返回一个jQuery对象而不是一个DOM元素。因此，不会返回任何元素：

var element1 = $("selector1");
var element2 = $("selector2");
$([element1,element2]) // will not return any elements

要返回DOM元素而不是jQuery对象，您必须在jQuery对象的0位置访问该属性。如下：$("element")[0]。这就是将工作的原因：

var element1 = $("selector1")[0]; //accessing dom element 
var element2 = $("selector2")[0]; //from jQuery object
$([element1,element2])

Answer 2

这是我能想到的最短版本：

A.add([B[0], C[0], D[0]]).show();

这传递了一个元素数组，而不是jQuery对象。仅在B，C和D为单元素数组时才有效。

http://jsfiddle.net/nrabinowitz/Jb6VD/1/

Answer 3

假设您有原始DOM元素（不 jQuery对象，例如$('#abc')或$('.abc')），则无需使用add：

$([A,B,C,D]).show();

有关详细信息，请参阅$(...)函数的文档。

---

如果真的想要$(A,B,C,D)这样的A,B,C,D是jQuery对象，那么唯一真正的方法就是推出自己的函数。

这就是诀窍：

var all = function() {
    var objs = $();
    $.each(arguments, function(i,e) {
        objs = objs.add(e);
    });
    return objs;
};

// ...

all(A,B,C,D).show();

工作示例：http://jsfiddle.net/Jb6VD/5/

Answer 4

要获取多个jQuery对象（在某种程度上是“只是”数组）的并集所产生的集合，您可以使用$.merge：

var union = $.merge( $.merge(A,B), $.merge(C,D) );

$.merge仅适用于一对数组，因此在大量jQuery对象上使用它会非常烦人......在这种情况下，您可以使用$().get()来获取“原始数据” “数组和concat他们在一起：

var union = $([].concat(A.get(), B.get(), C.get(), ...));
// Assuming A, B, C... are jQuery objects