JavaScript DHTML/Development/Time
Содержание
A Clock Script
<source lang="html4strict">
<HTML> <HEAD> <TITLE>Clock</TITLE> <SCRIPT LANGUAGE="JavaScript"></SCRIPT> </HEAD> <BODY> <FORM> <INPUT NAME="clock" TYPE="TEXT" SIZE="50"
VALUE="&{dateTime()};">
</FORM> <SCRIPT LANGUAGE="JavaScript"></SCRIPT> </BODY> </HTML>
</source>
Creating a Clock Object and Displaying the Results on the Page
<source lang="html4strict">
<html> <head>
<title>JavaScript Unleashed</title> <script type="text/javascript"> </script>
</head> <body>
<script type="text/javascript"> </script>
</body> </html>
</source>
Display the Current Time in status bar
<source lang="html4strict">
/* JavaScript Bible, Fourth Edition by Danny Goodman John Wiley & Sons CopyRight 2001
- /
<HTML> <HEAD> <TITLE>Status Bar Clock</TITLE> <SCRIPT LANGUAGE="JavaScript">
</SCRIPT> </HEAD> <BODY onLoad="updateTime()"> </BODY> </HTML>
</source>
Formats the current hour and displays it in a static or dynamic way
<source lang="html4strict">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML>
<HEAD> <TITLE>JsLib 1.3 - Exemple - heure.js</TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> <META NAME="Author" CONTENT="Etienne CHEVILLARD"> <SCRIPT TYPE="text/javascript" LANGUAGE="Javascript">
/* heure.js
* Role : formate l"heure courante et l"affiche de maniere statique ou dynamique * Projet : JsLib * Auteur : Etienne CHEVILLARD (echevillard@users.sourceforge.net) * Version : 1.3 * Creation : 24/04/2001 * Mise a jour : 23/02/2005 */
// --- Variables globales --- // variables pour la mise a jour dynamique var heure_champ; var heure_timeout; // --- Fonctions --- // active la mise a jour dynamique de l"heure pour le champ specifie function chargerHeureDyna(champ) {
if (champ)
heure_champ=eval(champ);
heure_champ.value=heureCour();
heure_timeout=window.setTimeout("chargerHeureDyna()", 1000);
return true;
} // fin chargerHeureDyna(champ) // desactive la mise a jour dynamique de l"heure precedemment activee function dechargerHeureDyna() {
window.clearTimeout(heure_timeout); return true;
} // fin dechargerHeureDyna() // retourne l"heure courante au format HH:MM:SS function heureCour() {
var h_date=new Date(); var h_h=h_date.getHours(); var h_m=h_date.getMinutes(); var h_s=h_date.getSeconds(); if (h_s<10) h_s="0"+h_s; if (h_m<10) h_m="0"+h_m; return (h_h+":"+h_m+":"+h_s);
} // fin heureCour() // retourne l"heure courante en abrege, au format HH:MM function heureCourAbr() {
var h_date=new Date(); var h_h=h_date.getHours(); var h_m=h_date.getMinutes(); if (h_m<10) h_m="0"+h_m; return (h_h+":"+h_m);
} // fin heureCourAbr() // retourne l"heure courante au format HH:MM am/pm function heureCourAMPM() {
var h_date=new Date(); var h_h=h_date.getHours(); var h_m=h_date.getMinutes(); if (h_m<10) h_m="0"+h_m; var h_ampm="am"; if (h_h>11) h_ampm="pm"; if (h_h>12) h_h-=12; return (h_h+":"+h_m+" "+h_ampm);
} // fin heureCourAMPM() // retourne l"heure courante au format HH heure(s) MM function heureCourLng() {
var h_date=new Date(); var h_h=h_date.getHours(); var h_m=h_date.getMinutes(); if (h_m<10) h_m="0"+h_m; if (h_m<1) h_m=""; else h_m=" "+h_m; if (h_h>1) return (h_h+" heures"+h_m); else return (h_h+" heure"+h_m);
} // fin heureCourLng()
</SCRIPT>
</HEAD>
<BODY onLoad="chargerHeureDyna("document.f.t")"
onUnload="dechargerHeureDyna()">
JsLib 1.3
Exemple - heure.js
<NOSCRIPT>
Erreur : votre navigateur ne reconnait pas le Javascript ou est configuré pour ne pas prendre en compte le code Javascript. Dans ce dernier cas, vous pouvez modifier la configuration dans les préférences/options de votre navigateur.
</NOSCRIPT>
<P>Heure courante au format HH:MM:SS :
<SCRIPT TYPE="text/javascript" LANGUAGE="Javascript">document.write(heureCour());</SCRIPT>
<P>Heure courante au format HH:MM :
<SCRIPT TYPE="text/javascript" LANGUAGE="Javascript">document.write(heureCourAbr());</SCRIPT>
<P>Heure courante au format HH heure(s) MM :
<SCRIPT TYPE="text/javascript" LANGUAGE="Javascript">document.write(heureCourLng());</SCRIPT>
<P>Heure courante au format HH:MM am/pm :
<SCRIPT TYPE="text/javascript" LANGUAGE="Javascript">document.write(heureCourAMPM());</SCRIPT>
<P>Heure courante au format HH:MM:SS, mise à jour dynamiquement :
<FORM ACTION="GET" NAME="f">
<INPUT NAME="t" TYPE=TEXT VALUE="" SIZE=10>
</FORM>
</BODY>
</HTML>
</source>
Get the current time and then extract the hours, minutes and seconds
<source lang="html4strict">
<html> <head> <script language="JavaScript">
</script> </head> <body onLoad="showTime()"> <form name="htmlClock"> <input type="text"
name="timeField"
size=14>
</form> </body> </html>
</source>
Morning or Evening
<source lang="html4strict">
function dayPart() {
var oneDate = new Date();
var theHour = oneDate.getHours();
if (theHour < 12) {
return "morning";
} else if (theHour < 18) {
return "afternoon";
} else {
return "evening";
}
} <script language="JavaScript" type="text/javascript">
</script>
</source>
Time: hour, minutes, and seconds.
<source lang="html4strict">
/* To return the GMT time use getUTCHours, getUTCMinutes etc. */ <html> <body> <script type="text/javascript">
var d = new Date()
document.write(d.getHours())
document.write(".")
document.write(d.getMinutes())
document.write(".")
document.write(d.getSeconds())
</script> </body> </html>
</source>
Times Table
<source lang="html4strict">
<html> <head> <script language="JavaScript">
</script> </head> </html>
</source>
Time value
<source lang="html4strict">
<script language="JavaScript">
</script> This is the body of the document.<p> </body>
</source>
Update Time per second
<source lang="html4strict">
<html> <head><title>Update Time</title> <script>
function UpdateTime(){
var today = new Date();
var hour = today.getHours();
var mins = today.getMinutes();
var secs = today.getSeconds();
if (secs <=9){
secs = "0" + secs
}
var TotalTime = hour + ":" + mins + ":" + secs;
if (document.layers) {
document.layers.time.document.write(TotalTime);
document.layers.time.document.close();
}else if (document.all) {
time.innerHTML = TotalTime;
}
setTimeout("UpdateTime()", 1000)
} </script>
</head> <body onload="UpdateTime()"> </body> </html>
