Loops Exercises (and Answers!)

These exercises will help you become more comfortable with JavaScript loops. Don't worry if you can't finish them all in the allotted time. The important thing is that you understand what you are doing and why you are doing it. Do not hesitate to ask Lisa or Catherine for help if you need it; that's what we're here for! Have fun, and good luck!

Note: The answers have now been posted. To see the answers for an exercise, click on the Answers! link, then view the source of the page. (Go to Netscape's View menu and choose Page Source.)

To get started:

The exercises:

  1. Open ~/projects/loops/loops1.html in XEmacs.
    Loops are great at doing tasks that would be annoyingly repetitive otherwise. In this exercise, you need to write an HTML page that displays the numbers from 1 to 100 with a minimum of typing. You may find the document.write() function to be useful. It takes a string to print to the document as a parameter.

  2. Open ~/projects/loops/loops2.html in XEmacs.
    Remember your blooming flowers from the functions exercises? You're going to extend that HTML page once again. This time, in addition to making a specific flower or a random flower bloom, you're going to let the user make all the flowers bloom. Your allFlowersBloom() function should be written with the least amount of typing on your part.

  3. Open ~/projects/loops/loops3.html in XEmacs.
    Mr. Farmer is a farmer. He grows apple trees. But his trees have a little problem: The sun doesn't hit them quite evenly. The trees closest to the sun grow lots of plump, juicy red apples. The next column of trees grows only a few apples, and they're kind of sickly and yellow. The last column of trees doesn't grow any fruit at all. This HTML page shows what happens to Mr. Farmer's apple trees when the sun comes out. You should write a function called sunOut() that changes the moon image to a sun, makes the first column of trees grow lots of fruit (the image is tree-fruit.gif), the second column grow some fruit (the image is tree-somefruit.gif) and the last column grow no fruit at all (the image is tree.gif). As always, you want to do this with a minimum of typing. Be sure to read the comments in the program for some hints.