Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I found an answer at <a href="http://twelvestone.com/forum_thread/view/31411" rel="noreferrer">http://twelvestone.com/forum_thread/view/31411</a> and I'm reproducing parts of the thread here, verbatim, because I'm afraid the thread, and the very helpful answer, will evaporate.</p> <p>Flip 2006.06.26, 02:45PM — [ Crunchy Frog ] posts: 2470 join date: 2003.01.26</p> <p>Well after about 10 to 12 hours of searching, reading, and tinkering I've done it! I am CSS/JS code Ninja today!</p> <p>The JS code used is as follows:</p> <pre><code>&lt;script language="JavaScript"&gt; function changeRule(theNumber) { var theRules = new Array(); if (document.styleSheets[0].cssRules) { theRules = document.styleSheets[0].cssRules; } else if (document.styleSheets[0].rules) { theRules = document.styleSheets[0].rules; } theRules[theNumber].style.backgroundColor = '#FF0000'; } &lt;/script&gt; </code></pre> <p>I've tested this on FF(Mac), Safari(Mac), O9(Mac), IE5(Mac), IE6(PC), FF(PC) and they all work. The reason for the 'if' statement is some of the browsers use cssRules... some use just rules... And the only other hair is that you can't use "background-color" to refer to the style, you have to get rid of the hyphen and capitalize the first letter after the hyphen.</p> <p>To refer to the first CSS rule you'd use "changeRule(0)", the second "changeRule(1)" and the third "changeRule(2)" and so on...</p> <p>I haven't found a browser it doesn't work on.... yet.... Anything you say can and will be used against you. Over and over and over.</p> <hr> <p>BillyBones 2011.01.20, 11:57AM — [ in the barrel ] posts: 1 join date: 2011.01.20</p> <p>Hello, I registered in these forums just to add this little bit as I could not conveniently find it elsewhere:</p> <pre><code>function changeStyle(selectorText) { var theRules = new Array(); if (document.styleSheets[0].cssRules) { theRules = document.styleSheets[0].cssRules; } else if (document.styleSheets[0].rules) { theRules = document.styleSheets[0].rules; } for (n in theRules) { if (theRules[n].selectorText == selectorText) { theRules[n].style.color = 'blue'; } } } </code></pre> <p>This simply makes the CSS rule identifiable by its selector name rather than by its index number in the cssRules array.</p> <p>In other words, you can execute the Javascript function with the string argument "selectorText" instead of a number that is difficult to remember and susceptible to frequent changes if new styles are added.</p> <p>Thank you for your 10 to 12 hours of research, Flip, I hope I made a worthy addition.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload