Is there any negative to using only classes in HTML as opposed to ids and classes? (meaning that even if an element occurs once, it is still given a class rather than an id)
EDIT - How severe is the performance hit when using JavaScript with classes as opposed to ids?
For JavaScript, IDs provide a fast and deterministic way to select one and only one element. Selection by class (e.g. using a library like jQuery) can be useful e.g. "do this to all elements with class name XYZ".
How severe is the performance hit when using JavaScript with classes as opposed to ids?
Try it and see: http://jsperf.com/class-versus-id. In Chrome, I'm seeing varying differences (5%-40% slower to use class name). Note that getElementsByClassName is not universally supported (John Resig has a comparison of custom implmentations).
From a CSS perspective I use IDs sparingly and only when I know there will ever be one match (since IDs must be unique).
However, I think the question neglects one of the most important abilities of CSS: the ability to use structural selectors. Without these selectors combined with classes (and sometimes IDs), you risk having much more brittle and verbose CSS.
Complex selectors can also be extremely useful in JavaScript when implemented in an engine like Sizzle.
In other words, every element should probably not have an ID and/or class explicitly assigned to it.
Consider:
.foo .bar1 { } .foo .bar2 { } #bar3 { } Versus:
.foo > SECTION { } .foo > SECTION + SECTION { } .foo:last-child { } SECTION H2 { } P + P { margin-top: 1em; } /* etc */ In the first example, everything must be explicitly ID'd or have a class stated. The second examples rely more on document structure.
Ultimately the goal should be maintainable code first while achieving the cleanest markup possible.
getElementsByClassName() alone. Often getElementsByClassName() is used only as a starting point to navigate to a specific element, in that case I think we would see even worse results.
If you don't need the hooks for javascript, id's aren't necessary. Unlike id's, classes are reusable and you'll find some who advocate avoiding using id's for css altogether (I avoid it myself.) You'll find CSSLint suggests you avoid them too. There isn't widespread agreement on that yet, so you should consider both sides of that particular argument.
There is no disadvantage to not using IDs, unless you have the need to specifically refer to a single element.
Classes are also optional but allow you to refer to multiple elements at once.
That's all there is to it.
No, there isn't.
No real problem. Rather i would say the other way around is wrong, giving a single class alone and no ID's to many different elements. If you want to access a single element alone from all the elements with that class, then you would run into trouble
The advantage of an ID is that in CSS it's more specific than a class, so you can leverage that if need be and in JavaScript it's quicker to access a DOM element by ID than by class.
As to whether or not it's a disadvantage to not use IDs in your situation would be dependent on if the above are issues or not.
Speaking from experience, I'd have to say that not using IDs can have some disadvantages. Particularly when trying to integrate some JavaScript you made with any rather complex web application (because of no better alternative), or when parsing complete web pages, or even when developing JavaScript for your own website.
If you ever tried any of the above then maybe you've already found yourself wishing every major element had an ID, because:
Just to name a couple of reasons, I'm sure more could be found.
I'd have to say that a proper balanced use of both IDs and classes is the way to go. If you don't want to use IDs in CSS, then don't. But that doesn't prevent you from using IDs if you, or others, can take advantage from them.
