an array of strings as a jQuery selector?

Go To StackoverFlow.com

31

I have an array of strings that are valid jQuery selectors (i.e. IDs of elements on the page):

["#p1", "#p2", "#p3", "#p4", "#p5"]

I want to select elements with those IDs into a jQuery array. This is probably elementary, but I can't find anything online. I could have a for-loop which creates a string "#p1,#p2,#p3,#p4,#p5" which could then be passed to jQuery as a single selector, but isn't there another way? Isn't there a way to pass an array of strings as a selector?

EDIT: Actually, there is an answer out there already.

2009-06-16 15:03
by montrealist


46

Well, there's 'join':

["#p1", "#p2", "#p3", "#p4", "#p5"].join(", ")

EDIT - Extra info:

It is possible to select an array of elements, problem is here you don't have the elements yet, just the selector strings. Any way you slice it you're gonna have to execute a search like .getElementById or use an actual jQuery select.

2009-06-16 15:06
by Paul
join() is exactly it. Thank you - montrealist 2009-06-16 15:12


13

Try the Array.join method:

var a = ["#p1", "#p2", "#p3", "#p4", "#p5"];
var s = a.join(", ");
//s should now be "#p1, #p2, #p3, ..."
$(s).whateverYouWant();
2009-06-16 15:07
by matt b


8

What about $(foo.join(", "))?

2009-06-16 15:10
by Adam Luter


4

Use the array.join method to join them together

$(theArray.join(','));
2009-06-16 15:08
by Dan F
Hehe, I knew I'd be too slow on this darn iphone :- - Dan F 2009-06-16 15:09
Thank you for taking the time anyway - montrealist 2009-06-16 15:14


2

I think you're looking for join.

var arr = ["#p1", "#p2", "#p3", "#p4", "#p5"];
$(arr.join(","))
2009-06-16 15:08
by Mark


2

If you want them to do something individually there is also .each();

In the example below, each p ids clicks makes any one of them red:

var peas = ['#p1','#p2','#p3','#p4','#p5'];
$.each(peas, function(i){
    $(peas[i]).click( function(){
        $(peas[i]).css({'color':'red'});
    });
});

When you throw 'i' into a function parameter, it finds the values inside the arrays appropriately. When you do '.each()' the format looks like this:

$.each(array, function(i){
    // any code you wish as long as you have an array selector
    //$(array[i]).whatever function
});

An even bigger example. Say you want to make the P you click on red, but want the other ps return to default color. Just make an array of nonPea and voila!

var peas = ['#p1','#p2','#p3','#p4','#p5']
,   nonPeas = ['#p5, #p2, #p3, #p4'
              ,'#p1, #p5, #p3, #p4'
              ,'#p1, #p2, #p5, #p4'
              ,'#p1, #p2, #p3, #p5'
              ,'#p1, #p2, #p3, #p4']
;
$.each(peas, function(i){
    $(peas[i]).click( function(){
        $(peas[i]).css({'color':'red'});
        $(nonPeas[i]).css({'color':'black'});
    });
});

I know someone is bound to want to know about each value array as jquery selectors. Hope everything goes well!

Source: jQuery .each()

2017-08-11 13:23
by Gareth Compton


-1

Shorter:

["#p1", "#p2", "#p3", "#p4", "#p5"].toArray()
2017-04-30 15:33
by Bnaya Zil
Ads