Meek
Meek

Reputation: 3348

variable to hold multiple selectors

I have a lot of selectors which I need to manipulate several times in a script.

So far I have done this:

var allSelectors3 = $('#icon20,#icon21,#icon22,#icon23,#icon24,#icon25,#icon26,#icon27,#icon28,#icon29,#icon30,#icon31,#icon32');
var allSelectors2 = $('#icon12,#icon13,#icon14,#icon15,#icon16,#icon17,#icon18,#icon19'); 
var allSelectors = $('#icon2,#icon3,#icon4,#icon5,#icon6,#icon7,#icon8,#icon9,#icon10,#icon11');

$(allSelectors).show();
$(allSelectors2, allSelectors3).hide();

Is this the best way to do this?

Upvotes: 0

Views: 77

Answers (2)

gopi1410
gopi1410

Reputation: 6625

Since no one has mentioned jQuery performance rules, here are the performance rules.

Its good to declare selectors in a variable (if you have large number of them), and I see you doing it correctly.

Another option would be add a class to each element you have in Selectors1 as class="selector1", and so on. And then use:

$(".Selectors").show();
$(".Selectors2").hide();
$(".Selectors3").hide();

This is quite good-looking, but as you read in the performance rules, selction by class and other attributes is slower.

Also no need for the second $(). Use this directly:

var allSelectors3 = $('#icon20,#icon21,#icon22,#icon23,#icon24,#icon25,#icon26,#icon27,#icon28,#icon29,#icon30,#icon31,#icon32');
var allSelectors2 = $('#icon12,#icon13,#icon14,#icon15,#icon16,#icon17,#icon18,#icon19'); 
var allSelectors = $('#icon2,#icon3,#icon4,#icon5,#icon6,#icon7,#icon8,#icon9,#icon10,#icon11');

allSelectors.show();
allSelectors2.hide();
allSelectors3.hide();

Upvotes: 0

Jamiec
Jamiec

Reputation: 136114

No, there is no need for the second $().

var allSelectors = $('#icon20,#icon21,#icon22,#icon23,#icon24,#icon25,#icon26,#icon27,#icon28,#icon29,#icon30,#icon31,#icon32');
allSelectors.show()

to combine 2 lists use .add

allSelectors2.add(allSelectors3).hide();

Upvotes: 3

Related Questions