id和js- .. for CSS中的js apeel有什么区别？

Question

This question relates to the article http://davidwalsh.name/css-do . What are the differences and advantages these approaches?

<div class="do-launch-login">...</div>

<a class="do-close-modal">...</a>

<input class="do-autocomplete" />

and

<div id ="login" class="launch-login">...</div>

<a id="close" class="close-modal">...</a>

<input id="autocomplete" class="clautocomplete" />

Answer 1

The author calls them do- prefixes, i call them (and use them as) js- or jQ- prefixes.
Javascript has a whole scale of possible applications in DOM manipulation... than just a do-

Those prefixes are to indicate classes used exclusively by JS , means you cannot find them in ie: style.css but rather as part of some Javascript logic in script.js .

Also you cannot use ID multiple times cause ID should be unique-per-page , so, classes in any case, spiced with a prefix to distinguish it's application.
(hm... do- ... still seems pretty funny.)

Answer 2

Personally for me, I generate a lot of dynamic HTML on the fly for my web applications. Because of this, I try to never use IDs as I make multiple instances of the same HTML objects.

It is considered terrible practice to ever have a duplicate of an ID, so I always use class names as selectors.

But that's just me.

Answer 3

Id should only be used for a single thing. However a class can be given to many different things. You could easily google this for more in depth answer

Answer 4

Some consider use of id in css a bad practice, because of:

1. The element is not re-usable on that page.
2. This is the beginning downward sprial into specificity.
3. Usually, IDs refer to something specific, and abstracting would be tough.
4. Any performance gains picked up by using id, is negated by adding any other selector to the left for that id

quoted from http://screwlewse.com/