cssText read only in Moz?

In IE you can change a stylesheet rule:

rule_reference.style.cssText='color: blue';

but the Moz equivalent appears to be read only, or am I doing this wrong?:

rule_reference.cssText='span { color: red }';

Perhaps I should just add a new rule.

Jeff

On 16 Gen, 09:55, Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

* *In IE you can change a stylesheet rule:

* rule_reference.style.cssText='color: blue';

* but the Moz equivalent appears to be read only, or am I doing this wrong?:

* *rule_reference.cssText='span { color: red }';

* *Perhaps I should just add a new rule.

* *Jeff

if you want change the whole rule than you must
do it from its parent stylesheet by deleteRule/insertRule (there is
not a modyfyRule)

However I think that this is a brute-force manner to modify a
stylesheet. May be for run-time/temporary modification it should
be better to use the style property...

Regards

On Jan 16, 5:49*am, josh <xdevel1... (AT) gmail (DOT) com> wrote:

On 16 Gen, 09:55, Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

* *In IE you can change a stylesheet rule:

* rule_reference.style.cssText='color: blue';

* but the Moz equivalent appears to be read only, or am I doing this wrong?:

* *rule_reference.cssText='span { color: red }';

* *Perhaps I should just add a new rule.

* *Jeff

if you want change the whole rule than you must
do it from its parent stylesheet by deleteRule/insertRule (there is
not a modyfyRule)

That's not completely accurate (and addRule is better supported than
insertRule.) The quirksmode.org Website has some good information on
the various compatibility problems related to the stylesheets
collection (if you can get past the horrible navigation.)

However I think that this is a brute-force manner to modify a
stylesheet. May be for run-time/temporary modification it should
be better to use the style property...

It is typically used in code that runs during the page load to hide
content that will be replaced when the document is ready.

As for changing colors, that would be better done by switching
classes. It is faster to add or modify a rule, but it raises
compatibility issues and tangles up presentation with behavior.

David Mark wrote:

On Jan 16, 5:49 am, josh <xdevel1... (AT) gmail (DOT) com> wrote:
On 16 Gen, 09:55, Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

In IE you can change a stylesheet rule:
rule_reference.style.cssText='color: blue';
but the Moz equivalent appears to be read only, or am I doing this wrong?:
rule_reference.cssText='span { color: red }';
Perhaps I should just add a new rule.
Jeff
if you want change the whole rule than you must
do it from its parent stylesheet by deleteRule/insertRule (there is
not a modyfyRule)

OK, I'll do that. Although I'm thinking that adding a rule will make
it occur at the end of the stylesheet and it would overide the styles
specified in an earlier rule of the same specificity. Hence you won't
have to delete the earlier rule. Whew!

That's not completely accurate (and addRule is better supported than
insertRule.) The quirksmode.org Website has some good information on
the various compatibility problems related to the stylesheets
collection (if you can get past the horrible navigation.)

Thanks.

However I think that this is a brute-force manner to modify a
stylesheet. May be for run-time/temporary modification it should
be better to use the style property...

It is typically used in code that runs during the page load to hide
content that will be replaced when the document is ready.

Didn't know that. Example?

As for changing colors, that would be better done by switching
classes.

The trouble with classes is that when you start switching that way,
everything starts looking like a class name. And you wind up with
everything having a classname. It's much cleaner to use descendants and
you can style entire blocks by modifying a simple set of rules.

It is faster to add or modify a rule, but it raises

compatibility issues and tangles up presentation with behavior.

Point taken, but I'm using this as a design tool, not as presentation
for the casual surfer.

Jeff

On Jan 16, 12:14*pm, Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

David Mark wrote:
On Jan 16, 5:49 am, josh <xdevel1... (AT) gmail (DOT) com> wrote:
On 16 Gen, 09:55, Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

* *In IE you can change a stylesheet rule:
* rule_reference.style.cssText='color: blue';
* but the Moz equivalent appears to be read only, or am I doing thiswrong?:
* *rule_reference.cssText='span { color: red }';
* *Perhaps I should just add a new rule.
* *Jeff
if you want change the whole rule than you must
do it from its parent stylesheet by deleteRule/insertRule (there is
not a modyfyRule)

* *OK, I'll do that. Although I'm thinking that adding a rule will make
it occur at the end of the stylesheet and it would overide the styles
specified in an earlier rule of the same specificity. Hence you won't
have to delete the earlier rule. Whew!



That's not completely accurate (and addRule is better supported than
insertRule.) *The quirksmode.org Website has some good information on
the various compatibility problems related to the stylesheets
collection (if you can get past the horrible navigation.)

Thanks.



However I think that this is a brute-force manner to modify a
stylesheet. May be for run-time/temporary modification it should
be better to use the style property...

It is typically used in code that runs during the page load to hide
content that will be replaced when the document is ready.

* *Didn't know that. Example?

For example, suppose you have a tree widget that enhances existing
list elements. You can add a display:none rule to hide nested lists
during the load. Before doing so, you would obviously test whether
the environment will support your widget. You would also need to test
if inline display styles are exposed by the DOM (otherwise you might
hide the nested lists for good.)

Another example would be to add a visibility:hidden rule to hide
content that will be replaced by a Flash movie.

This sort of code is typically included at the top of the body. An
alternative strategy that is more backwardly compatible, but less
future-proof, is to use document.write to add an inline style block to
the head.

As for changing colors, that would be better done by switching
classes.

The trouble with classes is that when you start switching that way,
everything starts looking like a class name. And you wind up with

I don't.

everything having a classname. It's much cleaner to use descendants and
you can style entire blocks by modifying a simple set of rules.

Typically I specify rules for descendants of container elements that
have a certain class. It depends on the application though.

On Jan 16, 12:14 pm, Jeff <jeff (AT) spam_me_not (DOT) com> wrote:

David Mark wrote:
On Jan 16, 5:49 am, josh <xdevel1... (AT) gmail (DOT) com> wrote:
On

<snip>

However I think that this is a brute-force manner to modify a
stylesheet. May be for run-time/temporary modification it should
be better to use the style property...
It is typically used in code that runs during the page load to hide
content that will be replaced when the document is ready.
Didn't know that. Example?

For example, suppose you have a tree widget that enhances existing
list elements. You can add a display:none rule to hide nested lists
during the load. Before doing so, you would obviously test whether
the environment will support your widget. You would also need to test
if inline display styles are exposed by the DOM (otherwise you might
hide the nested lists for good.)

That makes sense, I must have thought you were going in a different
direction.

Another example would be to add a visibility:hidden rule to hide
content that will be replaced by a Flash movie.

This sort of code is typically included at the top of the body. An
alternative strategy that is more backwardly compatible, but less
future-proof, is to use document.write to add an inline style block to
the head.



As for changing colors, that would be better done by switching
classes.
The trouble with classes is that when you start switching that way,
everything starts looking like a class name. And you wind up with

I don't.

That's because you've been around and you're a smart guy!

There's a lot of html littered with class="..., And I agree that
descendants are the best way to write maintainable html/css

Jeff

everything having a classname. It's much cleaner to use descendants and
you can style entire blocks by modifying a simple set of rules.

Typically I specify rules for descendants of container elements that
have a certain class. It depends on the application though.