HTML and CSS Reference
In-Depth Information
To begin creating the changeStyle() function:
1. At the bottom of the switchstyle.js file, insert the following code as shown in
Figure 14-62:
function changeStyle(sheet) {
/* Loop through all of the link elements */
var links = document.getElementsByTagName(“link”);
for (var i = 0; i < links.length; i++) {
/* Pick out only the links from preferred or
alternate style sheets */
if ( (links[i].rel == “stylesheet” ||
links[i].rel == “alternate stylesheet”) &&
links[i].hasAttribute(“title”) ) {
Figure 14-62
looping through the links collection
link must h a ve
the title attribute
rel attribute must be either
"stylesheet" or "alternate stylesheet"
2. Save your changes to the file.
For every preferred or alternate style sheet, the function should test whether the value
of the title attribute matches the value of the sheet parameter. If the two match, the
function should change the disabled property of the link to false —enabling the style
sheet in the document—and the function should set the disabled property for all other
style sheets to true . After looping through the links collection, only the preferred or
alternate style sheet specified by the user will be enabled in the document. You'll add
code to accomplish this now.
Search WWH ::

Custom Search