JavaScript Examples Bible - UserWorks Technologies

Chapter 4 ✦ The Document and Body Objects (Chapter 18)
Example
See the discussion of the fireEvent() method in Chapter 15 of the JavaScript
Bible for an example of the sequence to follow when creating an event to fire on an
element.
createStyleSheet([“URL”[, index]])
NN2 NN3 NN4 NN6 IE3/J1 IE3/J2 IE4 IE5 IE5.5
Compatibility ✓ ✓ ✓
Example
Listing 18-13 demonstrates adding an internal and external style sheet to a document.
For the internal addition, the addStyle1() function invokes document.
createStyleSheet() and adds a rule governing the P elements of the page (not
available for IE5/Mac). In the addStyle2() function, an external file is loaded. That
file contains the following two style rules:
H2 {font-size:20pt; color:blue}
P {color:blue}
Notice that by specifying a position of zero for the imported style sheet, the
addition of the internal style sheet always comes afterward in styleSheet object
sequence. Thus, except when you deploy only the external style sheet, the red text
color of the P elements overrides the blue color of the external style sheet. If you
remove the second parameter of the createStyleSheet() method in addStyle2(),
the external style sheet is appended to the end of the list. If it is the last style sheet to
be added, the blue color prevails. Repeatedly clicking the buttons in this example
continues to add the style sheets to the document.
Listing 18-13: Using document.createStyleSheet()
document.createStyleSheet() Method
function addStyle1() {
var newStyle = document.createStyleSheet()
newStyle.addRule(“P”, “font-size:16pt; color:red”)
}
function addStyle2() {
var newStyle = document.createStyleSheet(“lst18-13.css”,0)
}
Continued
245
document.createStyleSheet()