Skip to content
1.0http://trevorcreech.com/blog/2009/07/17/firefox-3-5-not-collapsing-spaces-in-javascript-classname/

Firefox 3.5 not collapsing spaces in JavaScript className

In JavaScript, to get all the classes on a given element, you call element.className, which gives a string with space-separated classes, such as “class1 class2”. You can also set this property directly, such as element.className = "class3 class4”. The norm here is that classes are separated by a single space, with no whitespace at either end, but since we are just setting a string directly, we can send in any whitespace we want. This is where things get interesting, because in Firefox 3.0, any unnecessary whitespace is removed, leaving the string the way you would expect it to be formatted. However, in the newly released Firefox 3.5, this does not happen, and the extraneous whitespace remains. Here’s a live example. Clicking this link sets its own className to "     class1     class2     ", and then displays its newly set className:

Try me!
In Firefox 3.0 you will see "class1 class2”, but Firefox 3.5 will show "     class     class2     ".

I’m not sure if this is a bug or a feature, but it’s a bit of a gotcha if you are at all sloppy in setting classes, as it might mess up a class-recognizing regex later on, which exactly what happened at work today, in our Google Reader extension.

Post a Comment

Your email is never published nor shared. Required fields are marked *
*
*