Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Ajax and JavaScript

  • Print
  • + Share This
This chapter is from the book

Around and Around with Loops

(Netscape and Internet Explorer/Mac)

In the last example, you checked to see if one particular plug-in was present. But if you're looking for any version of a plug-in whose name has changed, you're going to want to keep repeating the test until you check all of the installed plug-ins. To do this, you'll use a loop, which lets you repeat an action a specified number of times.

More about loops

The kind of loop that we mostly use in this book is the for loop, named after the command that begins the loop. This sort of loop uses a counter, which is a variable that begins with one value (usually 0) and ends when a conditional test inside the loop is satisfied.

The command that starts the loop structure is immediately followed by parentheses. Inside the parentheses you'll usually find the counter definition and the way the counter is incremented (i.e., the way the counter's value is increased). Script 3.2 shows you how to set up and use a loop to check all of a user's plug-ins for the presence of the Apple QuickTime plug-in. While you're looking at Script 3.2, notice that it contains two scripts, one in the header and one in the body of the page. The header script checks for the presence of the QuickTime plug-in, and the body script writes one of two different messages into the browser window, depending on the result of the plug-in test.

03fig03.jpg

Script 3.2 Welcome to your first JavaScript loop.

To use a loop to check for plug-ins

  1. hasQT = false The first thing the header script does is to set up a boolean, or logical, variable named hasQT. A boolean variable can only have the value true or false.
  2. for (i=0; i<navigator.plugins.length;
    U2192.GIF i++) {
    
    This line begins the loop. The variable i is traditionally used by programmers to denote a variable used as a counter. First i is set to 0. A semicolon signals that there is another statement on the same line. The next part is read "if i is less than the number of plug-ins, then add 1 to the value of i." Because this is new, let's break that down a bit. The object navigator.plugins.length gives the number of installed plug-ins. The i++ part uses the ++ operator you saw in Chapter 1 to increment the value of i by 1.
  3. if (navigator.plugins[i].name
    U2192.GIF indexOf("QuickTime") >= 0) {
    
    This line begins a conditional test inside the loop. The array navigator.plugins[i] uses the square brackets to indicate that the test should look at the plug-in on the list with the current value of i. So if the loop has already checked, say, two plug-ins, the value of i the next time through the loop would be 2 (JavaScript starts counting with 0, not 1; see the "JavaScript Strings" sidebar). The method indexOf() returns where (and if) the string "QuickTime" was found in navigator.plugins[i].name. If the string isn't found, the value is –1. If it is found, the value is its starting position (starting at 0 again).
  4. hasQT = true When the test is satisfied, the hasQT variable gets set to true.
  5. if (hasQT) { In the body script, this conditional test shows how things can be implied in JavaScript. This line can be read "If hasQT is true, execute the following line." In this case, having the variable within the parentheses of the if statement implies that the variable's value must be true to continue.
  6. document.write("<embed src='images/
    U2192.GIF cometAnim.mov' width='320'
    U2192.GIF height='250'><\/embed>")
    
    If the test result is true, then write the movie file referenced within the single quotes to the document window ( Figure 3.2 ). As in the previous task, if the user's browser has the capability, they'll see the best possible version of your page.
    03fig04.gif

    Figure 3.2 If the user has QuickTime, then put the movie file on the page.

  7. else {
    document.write("<img src='images/
    U2192.GIF cometAnim.jpg' alt='comet'
    U2192.GIF width='320' height='208' \/>")
    
    If the test fails, then the script displays a JPEG still from the QuickTime movie ( Figure 3.3 ).
    03fig05.gif

    Figure 3.3 If QuickTime isn't present, replace the movie with a JPEG.

  • + Share This
  • 🔖 Save To Your Account