How to use CreateStyleSheet(stylehere)

[guoshuang]

i have read this

http://msdn.microsoft.com/workshop/a...stylesheet.asp

but i can not understand this

If the URL contains style information, this information will be added to the style object.

like this?

document.createStyleSheets("<style>body {color:red}</style>")
or
document.createStyleSheets("body {color:red}")

all these two can not work.can anybody help me to write the right one?

thanks...

[brothercake]

Neither of those things. Try this:

var sheet = document.createStyleSheet();
sheet.addRule('body','color:red');

All they're saying with "this information will be added to the style object" is that if you go like this:

var sheet = document.createStyleSheet('whatever.css');
sheet.addRule('body','color:red');

It will load all the existing rules from that stylesheet, and then add the new rule to it. Whether they mean it will be added to the computed style or literally added to .style - I don't know - one would hope the former, but knowing IE it might be the latter.

BUT - here's the big but - all of this is IE proprietary junk. Loosely similar to DOM 2 CSS (the standard from which it's derived) but it abuses the rule syntax by forcing you to write selector/property pairs, rather than inserting single rules which is (imo) far more logical and in practise far more useful.

But DOM 2 CSS is not complete either - although it allows you to create a stylesheet and insert rules, it provides no mechanism for associating the newly-created stylesheet with the document. But you can still make it work by: creating a <style> node with createElement, then finding it in the document.styleSheets collection, then you have an object into which you can insert rules. This only works in Mozilla (afaik); more info at http://www.codingforums.com/showthread.php?t=18442.

What you can also do is create a <style> node and then insert CSS rules as text nodes - which works in Opera 7.5 and Mozilla builds other than very old ones (<1.0) Dunno about IE. Info at http://www.codingforums.com/showthread.php?t=29314

I guess you could use a combination of that and IE's proprietary model, but unless you need to create the stylesheet after load time, you may as well use document.write for IE ... what I do is compile rules in an array at load time - since each array item is a complete rule I can just iterate through it and use multiple techniques - insert a rule, or create and insert a text node, or write another line out with document.write