I got to thinking today: what is the best way of getting a distinct (ie no repeats) list of classes used in a document that (preferably) match a pattern (regular expression) pattern or (alternatively) start with a certain character sequence? JQuery can be used for this or just straight Javascript.
Now it should obviously cater for all legal class usages, for example:
<div class="class1 class2 class3">
</div>
And I don't want to parse the document with regular expressions. That's simply too error prone. What I'm interested in is a Jaavascript solution that walks the DOM or uses something like jQuery to do that.
Oh this should also include any classes that have been dynamically added/removed through previous Javascript code.
Suggestions?
function gatherClasses() {
var tags = document.getElementsByTagName('*');
var cls, clct = {}, i, j, l = tags.length;
for( i = 0; i < l; i++ ) {
cls = tags[i].className.split(' ');
for( j = 0; j < cls.length; j++ ) {
if( !cls[j] ) continue;
clct[cls[j]] = 'dummy'; //so we only get a class once
}
}
cls = [];
for( i in clct ) {
cls.push( i );
}
return cls;
}
alert(gatherClasses())
Heres a version with a regexp match
function gatherClasses( matchString ) {
if( matchString ) {
var rxp = new RegExp( matchString );
} else {
var rxp = /.*/;
}
var tags = document.getElementsByTagName('*');
var cls, clct = {}, i, j, l = tags.length;
for( i = 0; i < l; i++ ) {
cls = tags[i].className.split(' ');
for( j = 0; j < cls.length; j++ ) {
if( !cls[j] || !rxp.test( cls[j] ) ) {
continue;
}
clct[cls[j]] = 'dummy'; //so we only get a class once
}
}
cls = [];
for( i in clct ) {
cls.push( i );
}
return cls;
}
//find classes that match 'stack'
alert(gatherClasses('stack'))
Can this help you?
http://httpcode.com/blogs/PermaLink,guid,77f17d9c-cdc0-4fcb-a392-3cc70ef6ac23.aspx
<input type="radio" class="star star_id_45 star_group_5" />
$("input[class*='star_id_45']")
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With