JavaScript Examples Bible - UserWorks Technologies

Style Sheet
Objects
(Chapter 30)
Examples in this chapter focus on the properties and
methods of the styleSheet object. As described in
Chapter 30 of the JavaScript Bible, object models that support
scriptable style sheets define both the STYLE element object
(representing the element created with a tag pair)
and the more abstract styleSheet object. The latter may be
created by virtue of a STYLE element or perhaps imported
from an external style sheet definition file.
Use the styleSheet object to gain access to the details of
the rules defined for a given style sheet. Methods of the
styleSheet object (different syntax for IE4+ and W3C object
models) allow dynamic creation or deletion of rules within a
style sheet. Properties of the styleSheet object (again, different
syntax) return arrays of objects representing the style
rules contained by the style sheet. The rule objects themselves
have properties allowing reading and writing of rule
selectors and even individual style attributes within that rule
(since a single rule can list multiple style attributes).
Examples Highlights
✦ Compare examples for the styleSheet.cssRules and
styleSheet.rules properties to see how different
browsers provide access to arrays of rule objects.
✦ You can observe in The Evaluator (Chapter 13 in the
JavaScript Bible) how the styleSheet.disabled property
can switch a style sheet on and off dynamically.
✦ Compare the styleSheet object method pairs for
inserting and deleting rules to an existing style sheet.
The walk-through examples let you follow the same
steps for both the IE4+ and NN6 syntaxes.
✦ The final example in this chapter demonstrates how
scripts can modify a single attribute of a style sheet rule.
14
C H A P T E R
✦ ✦ ✦ ✦
In This Chapter
Enabling and
disabling entire style
sheets
Accessing an
individual style rule
from a style sheet
Adding and deleting
style sheet rules
✦ ✦ ✦ ✦