I have been pondering about when to use an ID instead of a CLASS.
As far as I can see an ID can be changed to a CLASS and then it is easy to combine CLASSes.
By just using classes the script is:
reduced in length
simpler to read
achieves the same results.
<p class='selector_1 selector_2' id='selector_3'>
paragraph using an ID
</p>
<p class='selector_1 selector_2 selector_3'>
paragraph just using classes
</p>
Can anyone think of a really good reason and an example for using an ID instead of a class?
Netscape 4 was the last browser to only work that with a name attribute. It was also the last browser to require it on an <a> tag rather than on any tag.
The only reason for still having <a name> is if you haven’t updated the HTML since Netscape 4 died in 2005.
Yep – very close to “The Mother Ship”. Chaeng Wattana is about 15 minutes from here. I went there last week actually, and managed to get everything cleared in less than 30 minutes.
Are you interested in football? If so, did you hear that Muang Thong United lost 1-0 to that team in Syria last night.
Keep with sprites mate :). They increase loading time, less bandwidth used from images, and overall a very clean method. Javascript can be turned off, is messy code, and all around is blegh :p.
Yes I knew about the IDs being unique and have just removed umpteen while installing Sprites, trying to get some “Google Brownie Points”. Apparently “Sprites minimize HTTP Requests”. Although after reading about the JavaScript I am tempted to put them back again
Today “font tok mak-mak”, no flooding but it is now clear and I am off out to get a bite to eat.
If you are living near Don Muang you must be close to “The Mother Ship” as my son fondly calls Immigration
If you have an item that you know can only ever appear once on each page, it is often better to use an ID, because then you can make your CSS simpler - you don’t have to worry about other declarations on any classes overriding it, because a single ID will outrank any number of classes and elements.
IDs can also be used in internal links, eg <a href=“#item”>, although you won’t necessarily want to combine these with styling so they may be more of a structural hook than a styling hook.
If you are using Javascript, getElementByID is fine and dandy but getElementByClassName is non-standard and not unanimously supported.
There are only THREE real reasons to use an ID instead of a class.
1) as a NAME – You can target it like a element that has NAME on it. For example:
<div id=“content”>
and
<a name=“content”></a>
can both be accessed via
<a href=“#header”>Skip to Content</a>
I’m amazed how many developers don’t know that one. It’s why there’s little legitimate reason for any modern site to still be using the NAME attribute on empty anchors like it’s still 1997.
2) Javascript So you can target it directly using getElementById
3) Specificity as mentioned by others ID’s trump classes.
Classes win out whenever you need to use it more than once, since an ID is supposed to be unique, only used once per page. Kind of like H1
@ralph.m
I will test the specificity using classes and ensure that the classes do what I want them to do
@felgall
>>> JavaScript document.getElementById()
A very good reason to consider using IDs, thankyou.
@RyanReese
Yes I did search and did not find a satisfactory reason for just using IDs. Now with hindsight if I included JavaScript and getElementbyID in the search then no doubt I will find a good reason.
You done well at “The Mother Ship” only taking 30 minutes. I am there again on Tuesday helping a friend with his visa. I hope it does not take too long.
No I missed the football and surprised it was not rained off.
<a href=“#id”> links to <div id=“id”> it doesn’t link to <div class=“id”>
in JavaScript document.getElementById() can get a specific id but can’t get a class. document.getElementsByClassName() exists in some but not all browsers
