JQuery - How to use a variable as selector using an attribute with it?

Question

What I would like is to do this:

var theId = anId;

$('#someId .someClass[id=' + theId + ']').css('border-color', 'red');

...but using a varible for the "selector part":

var mySelector;

if(condition1){mySelector= $('#someId .someClass');}
if(condition2){mySelector= $('#anotherId .anotherClass');}

$.each(anArray, function(i, v) {
    mySelector[id=' + v.id + '].css('border-color', 'red'); 
});

(This is unfortunately not working. I need help for correcting this syntax)

I tried several syntax that did not work. Hope someone can help. Thank you in advance for your replies. Cheers. Marc.

I don't undertand, you want a child of .someClass that has an ID of theId? — Mild Fuzz
– Mild Fuzz, Commented Mar 6, 2012 at 10:43
This question is pretty confusing. Selectors are nothing else than strings and $() does not return a selector. — Álvaro González
– Álvaro González, Commented Mar 6, 2012 at 10:45
It's not clear what you want. Your first sample should work. Your second sample is unclear to me. — Tomalak
– Tomalak, Commented Mar 6, 2012 at 10:45
Hello everyone. Thanks for trying to help. I modified what I am trying to do but which is not working. I edited my post. Have a check... — Marc
– Marc, Commented Mar 6, 2012 at 10:59

Matteo-SoftNet · Accepted Answer · 2012-03-06 11:18:44Z

1

After your edit, I think you should do this:

var mySelector_string;
var theId = anId;

if(condition1){mySelector_string= '#someId .someClass';}
if(condition2){mySelector_string= '#anotherId .anotherClass';}

$.each(anArray, function(i, v) {
    $(mySelector_string+"[id='" + v.id + "']").css('border-color', 'red'); 
});

edited Mar 6, 2012 at 11:18

answered Mar 6, 2012 at 10:48

Matteo-SoftNet

5313 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

csharpnumpty Over a year ago

Why is return false; in there?

Matteo-SoftNet Over a year ago

Efficiency; when the condition is met, we exit from the cycle.

Marc Over a year ago

Hello DotMat. This is not what I am looking for. Proberly because I was not clear in my post. I just edited it. You can check. It will be more clear to you what I am tring to do now...

Mild Fuzz · Accepted Answer · 2012-03-06 10:45:23Z

0

$('#someId .someClass #'+theId).css('border-color', 'red');

will get a child of .someClass with id theId

$('#someId .someClass#'+theId).css('border-color', 'red');

will get an instance of .someClass with id theId

answered Mar 6, 2012 at 10:45

Mild Fuzz

31.3k34 gold badges106 silver badges152 bronze badges

1 Comment

Marc Over a year ago

Hello Mild Fuzz. This is not what I am looking for. Proberly because I was not clear in my post. I just edited it. You can check. It will be more clear to you what I am tring to do now...

csharpnumpty · Accepted Answer · 2012-03-06 10:48:28Z

0

If your question is how you can cache a selector which is dynamically constructed for re-use, then you can do the following:

$("div p a " + someOtherSelectorRequirement).click(function(){ });

can become

var a = $("div p a " + someOtherSelectorRequirement);
a.each(function(){ Console.Log($(this).text());
a.addClass("someClass");

if you are asking if you can re-use the same selector in an object, or variable.

answered Mar 6, 2012 at 10:48

csharpnumpty

3,7231 gold badge33 silver badges46 bronze badges

1 Comment

Marc Over a year ago

Hello SpaceBison. This is not what I am looking for. Proberly because I was not clear in my post. I just edited it. You can check. It will be more clear to you what I am tring to do now...

Álvaro González · Accepted Answer · 2012-03-06 11:31:08Z

I think there're a couple of misused terms in your question. Learning them will probably help you to fix your code.

jQuery object instance: it's a JavaScript object that (among other things) contains a possibly empty internal array of DOM nodes on which you can perform further operations. You obtain one every time you call jQuery() (possibly aliased as $()).

Selector: It's a JavaScript string that represents a CSS query rule, e.g.: "ul>li:first". Many functions in jQuery, including the jQuery() function, accept selectors as parameters and use them to find or filter DOM nodes in the current chain.

So you basically have strings and objects and both are regular JavaScript data types and behave as such. You can, for instance, store them in variables or pass them as function arguments. You just need to know the difference between a CSS selector and the HTML elements found through it.

Collectives™ on Stack Overflow

JQuery - How to use a variable as selector using an attribute with it?

4 Answers 4

3 Comments

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related