Working with Arrays, Loops, and Conditional Statements - HTML, CSS, and Dynamic HTML - page 864

To start the writeCalDays() function:

◗

1. Return to the calendar.js file in your text editor.

◗

2. At the bottom of the file, insert the following function, as shown in Figure 12-23:

function writeCalDays(calendarDay) {

// Determine the starting day of the month

// Write blank cells preceding the starting day

// Write cells for each day of the month

}

Figure 12-23 starting the writecalDays() function

◗

3. Save your changes to the file.

Setting the First Day of the Month
To loop through all of the days of the month, you'll need to keep track of each day as
it's written to the calendar table. You'll store this information in a Date object named
day . The initial value of the day variable will be set to match the first day of the calendar
month using the following expression:

var day = new Date(calendarDay.getFullYear(), calendarDay.
getMonth(), 1);
Note that the new Date() object constructor uses the four-digit year value and month
value from the calendarDay parameter to set the year and month, and then sets the day
value to 1 to match the first day of the month. Next, to determine the day of the week on
which the month starts, you'll use the following getDay() method:

var weekDay = day.getDay();
Recall that the getDay() method returns an integer ranging from 0 (Sunday) to 6
(Saturday). You'll add these two commands to the writeCalDays() function now.

To create the day and weekDay variables:

◗

1. Below the first comment in the writeCalDays() function, insert the following com-
mands as shown in Figure 12-24:

var day = new Date(calendarDay.getFullYear(),
calendarDay.getMonth(), 1);
var weekDay = day.getDay();