Dátum és óra megjelenítése, eseménynél

Jelen esetben, a javascript programok, közvetlen a html fájlban íródnak.

Amikor gyakorlunk, a most látott böngésző ablakának felső részén, megjelenik egy figyelmeztető szöveg, a biztonság érdekében.
A beállítások megjelenítéséhez kattintson, ide felírat.
Ilyenkor a megjelenő ablakban a blokkolt tartalom engedélyezése szövegre kell kattintani, hogy programunk a gyakorlás alatt is működjön.
Vannak böngésző programok, melyek a biztonság érdekében, minden alkalomkor kérik az engedélyeztetést.

Azon dátum és idő, mely a html lapunk módosításának időpontját mutatja.

<div id="datum">
<script language="JavaScript" type="text/javascript">document.write (document.lastModified); </script>
</div>

Pontos idő, weboldalra történő belépéskor, vagy frissítéskor

UTC: univerzális koordinált idő. Francia megfelelőjének rövidítése.
Melyet korábban greenvwichi középidőként ismertünk(GMT) Ennyi az idő a kezdő délkörön, London Greenwich kerületében.
Meg kell adnunk a helyi és az univerzális időt
A program elején létre kell hozni egy változót, a jelenlegi dátum tárolására.
A változó egy tároló, melyben külömböző dolgokat tárolhatunk (számokat szöveget dátumokat stb.)
A következő utasítás létrehoz egy now elnevezésű véltozót, melyben elhelyezi a pontos időt és a dátumot.
locatime: jelenlegi dátum
utctime: univerzális megfelellője.
Ahhoz hogy adatot jelenítsünk meg, használni kel a dokument.write utasítást, melyet a záró script címke elé kell beírni.
A pluszjelek két szám között használjuk, a böngésző összeadja azokat.

Most, csak a localtime időt jelenítjük meg

<script language="JavaScript" type="text/javascript">
now = new Date ( ) ; 
localtime = now.toString ( ) ;
document.write ( " <b>Local time: </b> " + localtime) ;
</script>

Most, csak az utctime időt jelenítjük meg

<script language="JavaScript" type="text/javascript">
now = new Date ( ) ; 
utctime = now.toGMTString ( ) ;
document.write ( " <b>UTC time: </b> " + utctime) ;
</script>

Most, mindkét időt egyszerre jelenítjük meg

<script language="JavaScript" type="text/javascript">
now = new Date ( ) ; 
localtime = now.toString ( ) ;
utctime = now.toGMTString ( ) ;
document.write ( " <b>Local time: </b> " + localtime + " <br />") ;
document.write ( " <b>UTC time: </b> " + utctime) ;
</script>

Most, csak az órát jelenítjük meg, dátumot nem
A megjelenő számok méretét megváltoztathatjuk, ha cimsorokra jellemző kezdő és záró cimkék között helyezzük el.

<script language="JavaScript" >
now = new Date ( ) ; 
hours = now.getHours ( ) ;
mins = now.getMinutes ( ) ;
secs = now.getSeconds ( ) ;
document.write (" <h1>") ;
document.write ( hours + " : " + mins + " : " + secs );
document.write ("</h1>");
</script>

Tegyük látványosabbá az órát. Megjelenítéshez, alkalmazzunk más és más betűméreteket

A méret nagysága legyen:
<h2> Local time: és UTC time:
<h1> Az óra
Írhatunk más címsormeghatározást, vagy betűméretet is.

A következő leírásban látható, hogy egy div szakaszban helyeztük el programunkat.
CSS, azaz Stíluslapon, ezen div szakaszhoz, tetszőleges meghatározásokat írhatunk, mellyel a megjelenési formát tetszőlegesen megváltoztathatjuk.

<div id="datum">

<script language="JavaScript" >
now = new Date ( ) ; 
localtime = now.toString ( ) ;
utctime = now.toGMTString ( ) ;
document.write ( " <h2>Local time: </h2> " + localtime + " <br />") ;
document.write ( " <h2>UTC time: </h2> " + utctime) ;
hours = now.getHours ( ) ;
mins = now.getMinutes ( ) ;
secs = now.getSeconds ( ) ;
document.write (" <h1>") ;
document.write ( hours + " : " + mins + " : " + secs );
document.write ("</h1>");
</script>

</div>

Ajánlott a külön JávaScript fájl használata.
(a fájl kiterjesztése: js )

Így több webhelyünk, vagy weboldalunk is hivatkozhat ugyan arra a JávaScript programra.
A html és jávascript programokat is könyebb modosítani, ha külön kölön fájlban vannak.

Utasítási sor, a HTML és JavaScript összekapcsolására:
<script language="JavaScript" type="text/javascript" src="java fájl neve.js"> </script>

Az utasítási sort, html lapunk szövegfolyamában tetszés szerinti helyen, div szakaszban, vagy div szakaszon kivül is elhelyezhetjük, azaz ott hól az időt megszeretnénk jeleníteni.

A HTML lap utolsó modosításának ideje

A pontos időt mutató vekkerek weboldali megjelenítésének leírásai megtekinthetők, ha:
- Ezen lap tetején látható zöld nyílra kattintunk
- Majd a németjuhász fotójára kattintunk,
- és az ott megjelenő óráknál kattintunk az adott témakörre.