Question

I am in the need of defining html classes from content, so pretty much every char could be used. According to html reference I may use cdata, so I should not run into problems. I figure though, that css and/or javascript/jquery won’t play nicely with that.

Anyone has experience with what chars can be used without problems or if there is a function/plugin/.. that tidies the class names, so that they are usable?

Answer 1

css classnames must be the usual identifiers (http://www.w3.org/TR/CSS21/syndata.html#characters)

In CSS 2.1, identifiers (including
element names, classes, and IDs in
selectors) can contain only the
characters [A-Za-z0-9] and ISO 10646
characters U+00A1 and higher, plus the
hyphen (-) and the underscore (_);
they cannot start with a digit.

Javascript doesn’t mind, since you will use classnames as Strings. So you can use any character as far as javascript is concerned.

If you want to strip your classnames down to the usable css subset, a simple regexp should be enough. If you want to encode your classnames into the same subset, it will be a little tougher, but I suppose you can try to Base64-encode them. Here are some jQuery plugins for base64 encoding/decoding.