HTML and CSS Reference
In-Depth Information
To start creating the NYClock() function:
◗
1.
Return to the
clock.htm
file in your text editor.
◗
2.
Above the closing
</head>
tag, insert the following embedded script, as shown in
Figure 11-3:
Be sure to enter the
code exactly as shown
in Figure 11-3, includ-
ing matching the use of
upper- and lowercase
letters. Recall that
JavaScript is a case-
sensitive language and
programs will not run
correctly if the case is
incorrect.
<script type = “text/javascript”>
function NYClock() {
// display the current date and time
document.clockform.dateNow.value = “99”;
document.clockform.timeNow.value = “99”;
// calculate the time left until the New Year's eve Bash
document.clockform.daysLeft.value = “99 day(s)”;
document.clockform.hrsLeft.value = “99 hour(s)”;
document.clockform.minsLeft.value = “99 minute(s)”;
document.clockform.secsLeft.value = “99 second(s)”;
}
</script>
Figure 11-3
the initial nYclock() function
writes placeholder
text to the dateN
o
w
and timeNow fields
writes placeholder
text to the daysLef
t
,
hrsLeft, minsLeft,
and secsLeft fields
◗
3.
Save your changes to the file.
Adding single-line com-
ments makes it easier to
interpret the commands in
a function.
These values will be updated constantly while the page is displayed by a user's browser.
Thus, the
NYClock()
function needs to run when the page is initially loaded, and then
repeatedly at one-second intervals thereafter. Because you'll need to control when and
how often the
NYClock()
function is run, you must learn how to work with events.
