Naming “class” and “id” HTML attributes - dashes v

Question

<div id="example-value"> or <div id="example_value">?

This site and Twitter use the first style. Facebook and Vimeo - the second.

Which one do you use and why?

Answer 1

It really comes down to preference, but what will sway you in a particular direction might be the editor you code with. For instance, the auto-complete feature of TextMate stops at a hyphen, but sees words separated by an underscore as a single word. So class names and ids with the_post work better than the-post when using its auto-complete feature (Esc).

Answer 2

I would suggest underscore mainly for the reason of a javascript side-effect I'm encountering.

If you were to type the code below into your location bar, you would get an error: 'example-value' is undefined. If the div were named with underscores, it would work.

javascript:alert(example-value.currentStyle.hasLayout);