CODEWITHSUNDEEP
jqueryjquery-selectors
rd42
rd42

Reputation: 3594

jquery multiple selectors for one element

I'm aiming to affect one element with different variations of the same function. I've used id, class, and a, but this seems like a really ugly way to do it, and I will eventually reach a limit of selectors. My code is below, I would love to have a more elegant way of implementing this with a less limited number of ways to affect one element on the page.

EDIT: below are just the selector parts of the code. An element can't have more than one id or class, so how would I add 10 separate ways to reference the same element, so I can do 10 different things with it at the same time?

            <script>
            $(document).ready(function()
                    { 

            $('a[title]').qtip({ (...)
});


            $('#tooltip2').qtip({ (...)
});

            $('.myclass').qtip({ (...)
});

Upvotes: 0

Views: 242

Answers (1)

user1106925
user1106925

Reputation:

You just use the same selector each time...

$('#tooltip2')

There's no reason you need to use a different selector each time you do something different to the element. The selector is just a way of identifying the element you want in the DOM.

You've updated the question. In the original question, each selector used was referring to the same element.

You've added...

"An element can't have more than one id or class..."

An element can have more than one class.

"...so how would I add 10 separate ways to reference the same element..."

You don't need to have different ways to select the same element, if you are indeed selecting the same element.

"...so I can do 10 different things with it at the same time"

How you select it really has little to do with what you do to it. If 10 different people want to talk to you, do each of them need to call you by a different name? The selector is simply a means of specifying the element you're targeting.

If you do need to work with it in several ways, it's best to select it once, and cache the selection...

var tt2 = $('#tooltip2');

tt2.qtip(...);

tt2.qtip(...);

tt2.qtip(...);

This is because a DOM selection is a fairly expensive operation. It's best to not do it repeatedly when unnecessary.

Upvotes: 3

Related Questions