- Powered by Domino 8.5.2 Domino Accelerator Pack
- Accelerate your web applications
Lotus Triple Search DominoExperts + Blogs + R8 forum -> Script vault -> JavaScript

 Detect if a stylesheet is loaded?

Tomas NielsenPost date: 2007-04-12 19:57

Does anyone know of a way to detect if a certain class exists?

What I would like to do is to detect if a class is set and if not load a stylesheet to set it.

Jonas WanningPost date: 2007-04-25 10:13

if we are talking about the rule object in CSS then iterating over document.stylesheet and styleSheet.rules could help.


for ( i = 0; i < document.styleSheets.length; i++ ){
  for ( n = 0; n < document.styleSheets(i).rules.length; n++ ){
   alert("Style rule " + n + " is titled " + document.styleSheets(i).rules.item(n).selectorText);


Kenneth HaggmanPost date: 2007-04-25 10:44

Almost the same code as Jonas's, but with error handling.
Some browsers generate errors and that needs to be caught.
For this to work, the CSS stylesheets must have a 'title' attribute.

    // Find the stylesheet titled 'myStyleSheet' and the rule 'myRule' within it.
    for (var ix=0; ix<document.styleSheets.length; ix++) {
        try {
            // This will generate an error in some browsers if no title is present.
            if (document.styleSheets[ix].title == "myStyleSheet") {
                var mySheet=document.styleSheets[ix];
                // Find all the css entries that we will use as width-indicators.
                var myRules = mySheet.cssRules? mySheet.cssRules: mySheet.rules
                for (var jx=0; jx<myRules.length; jx++) {
                    var thisSelector = myRules[jx].selectorText.toLowerCase();
                    if (thisSelector.substring(0, 7) == ".myrule") {
                        // Do whatever you need to do.
        catch (err) {
            // Don't do anything, just continue the loop.

Tomas NielsenPost date: 2007-04-29 13:39

Thanks for the info! At the time the only way I could get at it was by looking at the style sheets that were loaded.

for (i=0; i<document.getElementsByTagName('link').length; i++) {
 link = document.getElementsByTagName('link')[i].getAttribute('href');
 if (link.indexOf( "css.css" ) != -1)
  alert('Style sheet was loaded!');
But your suggestions offers more details of specific elements.

RSS feed
Subscribe to Forum

Share this page

Top posters
Tomas Nielsen212
Joacim Boive27
Fredrik Stöckel27
Niklas Waller13
Kenneth Haggman11
Bryan Kuhn10
Daniel Lehtihet9
Jonas Israelsson8