Connecting Tech Pros Worldwide Forums | Help | Site Map

CSS "id" and "class" syntax in javascript

Newbie
 
Join Date: Jul 2009
Posts: 6
#1: Jul 6 '09
I have a box defined like this:

Expand|Select|Wrap|Line Numbers
  1. <div id="shadow-container1">
  2. <div class="shadow1">
  3. <div class="shadow2">
  4. <div class="shadow3">
  5. <div class="container">
the innermost "container" is where content appears.

I have to pass the id of "container" to the javascript variable parameter
"target":

Expand|Select|Wrap|Line Numbers
  1. var countries=new ddajaxtabs("source", "target")
How do I replace "target" with the full id of "container", that is what would the correct syntax for "target" be?

I tried many variations but could not come up with one that works, tho this must be a simple one for the experts here.

acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,750
#2: Jul 7 '09

re: CSS "id" and "class" syntax in javascript


If it's as you've described, it should be "shadow-container1". If that doesn't work, give a link to the Ajax-tab code that you're using.
Newbie
 
Join Date: Jul 2009
Posts: 6
#3: Jul 7 '09

re: CSS "id" and "class" syntax in javascript


acoder,

As "target" has to resolve to "#shadow-container1 .container", the # alone does not work.

I don't understand what you mean by "give a link to the Ajax-tab code that you're using".
acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,750
#4: Jul 7 '09

re: CSS "id" and "class" syntax in javascript


I did a quick search and found that you're using the Dynamic Drive Ajax Tabs. OK, you need to pass the ID, so the easiest way is to give the container a unique ID:
Expand|Select|Wrap|Line Numbers
  1. <div class="container" id="container">
and pass that ID.
Newbie
 
Join Date: Jul 2009
Posts: 6
#5: Jul 7 '09

re: CSS "id" and "class" syntax in javascript


So I gave every div in the group a unique ID, doing away with the "class"es alltogether. This made the script happy!

Does this mean id+class combinations cannot be used in JS in general, or is this peculiar to the script in question?

Thank you and cheers.
acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,750
#6: Jul 7 '09

re: CSS "id" and "class" syntax in javascript


They can be used together, but the script required a unique ID. IDs are unique whereas classes are not. Sometimes you want some CSS rule/script to apply to a set of elements, so you use one class for all of them, but you also want to refer to a particular element for some rule and giving a unique ID makes sure of that. You can refer to a particular element without IDs, e.g. by using getElementsByClassName() and then indexing the correct one, but in this case, that wouldn't have worked.
rnd me's Avatar
Expert
 
Join Date: Jun 2007
Location: Urbana IL
Posts: 417
#7: Jul 8 '09

re: CSS "id" and "class" syntax in javascript


Quote:

Originally Posted by BobBlock View Post

So I gave every div in the group a unique ID, doing away with the "class"es alltogether. This made the script happy!

Does this mean id+class combinations cannot be used in JS in general, or is this peculiar to the script in question?

Thank you and cheers.

jQuery supports mixed searches just like css.
Newbie
 
Join Date: Jul 2009
Posts: 6
#8: Jul 8 '09

re: CSS "id" and "class" syntax in javascript


Quote:

Originally Posted by acoder View Post

They can be used together, but the script required a .....

Thank you again, acorder. Cheers.
Reply