Geek Answers Handbook

Is it possible to change the CSS rule selector in external loadable style sheets?

On a webpage containing a perpetual CSS stylesheet (downloadable via <link rel="stylesheet">), I would like to change the selector of one of my CSS rules. I can refer to the rule with:

var rule = document.styleSheets[…].cssRules[…];

(where …are the numbers).

After selecting, I can read its selector and other values:

rule.cssText // 'em { color: red }'
rule.selectorText // 'em'
rule.style.color // 'red'

However, when I try to write one of them, it only allows me to write an object style:

// These won’t work
rule.cssText = 'em.foo { color: red }';
rule.selectorText = 'em.foo';

// This will work
rule.style.color = 'blue';

Why doesn't he let me write .cssTextor .selectorText? From what I see in the spec , they are not readonly.

Update: I also checked inline stylesheets. It also does not work.

+4

More articles:


All Articles