Listing of all element's classes

[Brian Herold]

How can I get a list of all the css classes applied to an element?

document.getElementById("someelement");
someelement.?(classlist)... blah

Thanks

[Matt Kruse]

alert(document.getElementById('somelement').className);

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

[Ian Collins]

Brian Herold wrote:
> How can I get a list of all the css classes applied to an element?
>

An element only has one className attribute, do you want the styles? If
so, look up getComputedStyle() or for IE, currentStyle.

--
Ian Collins.

[Brian Herold]

I ended up doing:

if(theElement.className.indexOf("somestyle") != -1) {
//code here
}

That way I can check if an element currently has a particular style
applied to it.

[RobG]

Unless somestyle is a substring of some other style, in which case you
may get it wrong. Try using a regular expression and match whole
words:

var x = "fred blah tom";
var y = "blahfred blahblah blahtom";
var someClass = 'blah';
var classTest = new RegExp('\\b' + someClass + '\\b');
alert(
'Test: ' + classTest
+ '\n' + someClass + ' in ' + x + '? ' + classTest.test(x)
+ '\n' + someClass + ' in ' + y + '? ' + classTest.test(y)
);

Remember that an alement can have multiple class names in the className
attribute.

--
Rob

[Matt Kruse]

RobG wrote:
> var classTest = new RegExp('\\b' + someClass + '\\b');

This is insufficient for class names like "a-b" which are, as far as I can
tell, allowed by the specs:
http://www.w3.org/TR/CSS21/syndata.html#q6

"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, or a hyphen followed by a digit."

In my util lib at http://www.javascripttoolbox.com/lib/util/ I use the
following code:

// Determine if an object or class string contains a given class.
css.hasClass = function(obj,className) {
if (!defined(obj) || obj==null || !RegExp) { return false; }
var re = new RegExp("(^|\\s)" + className + "(\\s|$)");
if (typeof(obj)=="string") {
return re.test(obj);
}
else if (typeof(obj)=="object" && obj.className) {
return re.test(obj.className);
}
return false;