Constructing the Current Month of a Web Page Calendar

This is the fourth code segment:

//fill in the empty table cells with ' ' at the beginning of the month;

for (j=0;j<realStartDay;j++)

{

TDID = "M" + "0" + j;

document.getElementById(TDID).innerHTML = "&nbsp;";

}

This segment fills the empty cells at the beginning of the calendar with space characters. It uses a for-loop. It is a good habit to fill the empty cells before the first of the month, at the beginning of the calendar, with the space (&nbsp;) character. The start day (4 for example) of the week was held in the  startMonthDay variable.

The value of this variable has changed. Luckily, we copied it to the realStartDay variable. This variable indicates the day of the week where the first day of the month starts. So we have to fill the empty cells from the beginning of the first row with the space character to the day represented by this variable. That is what this code segment does.

The for-loop iterates from 0 to a number just before the value of the realStartDay variable. It cannot include the value of the realStartDay variable, since the table cell for this variable already has the number 1, the first day of the month. The first line in the for-loop creates the ID of the cell. The second line writes the space character into the cell using the ID.

We can take a break here. We continue in the next part of the series with the details of the fifth, sixth and last code segment. See you then.