Premiers pas en JavaScript
35.3 exemples : objet date
cuy copyleft
  See You Why?  

 


Méthodes de l'objet Date() (35.2) | | Objets Date() calendrier perpétuel (35.4)

Contenu

 

 

I. Objet date

voir < < < Section précédente

 

II. Les méthodes de l'objet Date()

voir < < < Section précédente

 

III. Exemples d'usage de l'objet Date()

Nous savons que les dates avec les méthodes applicables sont des outils remarquables pour tester des durées courtes (avec une précision du 1/1000 seconde) ou longues.

Dans les deux séquences précédentes relatives à l'objet Date(), nous avons déjà :

 

A. mesurer le temps de présence sur une page

Si l'on crée un objet de type Date(), rien ne nous empêche d'en créer d'autres à d'autres moments, ou d'affecter une nouvelle valeur à un autre moment.

Ainsi, en début de page (au moment de créer le menu qui se trouve en haut de chacune de nos pages, nous créons arrivee, un premier objet qui retiendra la date (et tous ces paramètres) d'arrivée sur la page :
arrivee = new Date();

Au même endroit, nous créons la fonction temps() qui sera appelée au moment voulu. Ce moment pourrait être lorsque l'internaute quitte la page <body onunLoad="temps();" ou lorsque l'internaute actionne un bouton (cela a été notre choix).

Dans cette fonction, nous créons un deuxième objet que nous avons baptisé nu retiendra la date de sortie ou du clic...
puis, comme nous ne pouvons additionner ou soustraire des dates, nous convertissons en millisecondes écoulées depuis le 1/1/1900 chaque objet Date() et faisons la différence de deux valeurs exprimées en msec. que nous stockons dans la variable appelée sec,
comme nous savons que sec est pour l'instant, exprimée en millisecondes, nous divisons par 1000 et stockons le résultat dans la même variable nommée sec, il faut bien économiser les variables utilisées,
il n'y a plus qu'à afficher le message avec la valeur sec calculée de secondes, d'où :
function temps() {
    nu = new Date();
    sec = nu.getTime() - arrivee.getTime();
    sec = sec / 1000;
    alert("Vous êtes sur cette page depuis "+sec+ " secondes.");
}

Le lecteur aura compris que je pouvais n'écrire qu'une seule ligne pour l'affectation de la variable sec, à savoir :
    sec = nu.getTime()/1000 - arrivee.getTime()/1000;
voire même :
    sec = (nu.getTime() - arrivee.getTime())/1000;
qui diminuera le nombre d'opérations à effectuer par l'ordinateur de votre internaute visiteur.

Il n'y a plus qu'à créer le bouton appelant la fonction de la manière suivante :
... cliquer sur ce bouton : <input value="Depuis combien de temps êtes-vous sur cette page ?" type="button" onClick="javascript:temps();">

 

B. faire clignoter une image

Si l'on admet qu'une image qui clignote est une image qui apparait un certain temps pour disparaitre un certain temps et que disparaitre peut être assimilé à faire apparaitre une autre image transparente, on comprendra facilement que l'on puisse faire clignoter une image, le tout étant de fixer les temps d'apparition et de disparition de celle-ci.

Le choix de l'image ne devrait pas poser de problème. Nous allons prendre comme image un sigle de CUY, dont l'adresse relative est "../../images/logocuy1mini4.gif" et une autre image vide, dont l'adresse relative est "../../html/typoweb/videj.gif" qui n'est autre qu'une image transparente de 1 pixel sur 1... plus petit, on ne peut pas ;o) . Dans le <body>, donnons l'instruction de faire apparaitre le logo CUY et surtout sans oublier de donner un nom à cette image (ici : "clignote") :
<img name="clignote" src="../../images/logocuy1mini4.gif" width="60" height="40">

Entre les balises <script>, créons un tableau ou array d'images tab_img qui contiendra l'adresse de nos deux images (dont une sera notre logo et l'autre d'un seul pixel qui pourrait même être de couleur transparente) :
tab_img = new Array("../../images/logocuy1mini4.gif","../../html/typoweb/videj.gif");
initialisons un compteur i_compteur,
var i_compteur = 0;
reste à créer une expression qui s'exécutera toutes les 0,75 seconde, paramètre à modifier si on le souhaite et qui fasse un maximum de choses en un minimum de lignes :
* incrémenter le compteur ;
* veiller à ce qu'il ne dépasse pas 1 ;
* puis, considérer comme source de l'image à afficher l'une des deux valeurs de notre tableau ;
* enfin, répéter cette exécution toutes les 0,75 seconde ;
c'est ce que fait :
setInterval("if (++i_compteur==2) i_compteur=0;"+"document.clignote.src = tab_img[i_compteur];"
,750);

Ne le dites à personne, vous venez de découvrir ici l'essentiel des images clignotantes de la page d'accueil de CUY, sauf que là :
* il y a 3 images différentes
   et le choix de l'image modifiée est aléatoire ;
* chacune peut avoir une quinzaine de valeurs
   et le choix de la valeur suivante est aléatoire ;
* le délai entre chaque changement est aléatoire.

 

C. rechercher l'âge de quelqu'un

On ne s'occupera pas ici de la manière de recueillir la date de naissance. On la fixera dans la première ligne du script ; la théorie vue précédemment nous a indiqué que deux formats étaient corrects : pour le 7 juin 1953, on écrira soit date_naiss=new Date("June 7, 1953 11:30:05"), soit date_naiss=new Date(1953,5,7) où l'on n'oubliera pas que juin, le 6e mois, aura l'indice 5...

Il suffit alors de faire la différence entre l'année actuelle et l'année de naissance et, si l'anniversaire n'a pas encore eu lieu, retirer un an. On en arrive alors à rédiger le script de la manière suivante :

date_naiss=new Date(1953,5,7);
nu = new Date();
ans = nu.getFullYear()-date_naiss.getFullYear();
anniv_en_cours = new Date(nu.getFullYear(),date_naiss.getMonth(),date_naiss.getDate());
if (nu < anniv_en_cours) {
    ans--;
}
alert("Vous avez aujourd'hui " + ans + " ans.");

Notre exemple montre que l'on peut comparer deux objets Date(). Cependant...
Attention : une erreur fréquente lorsqu'on veut comparer des dates est d'oublier que l'objet Date a une précision au millième de seconde... n'espérez donc jamais tester l'égalité de deux dates pour envoyer une carte de bons vœux ;o).
Ainsi, dans notre exemple, nu dépend de l'heure qu'il est à l'instant, mais anniv_en_cours est supposée être à minuit, zéro seconde et 000 millème de seconde.

 

D. afficher le calendrier du mois

voir suite >>>

 

VIII. Exercices relatifs à l'objet Date()

voir suite >>>

 

IX. Test relatif à l'objet Date()

voir suite >>>

 

 


Méthodes de l'objet Date() (35.2) | | Objets Date() calendrier perpétuel (35.4)

 

 

Merci de votre visite à partir de :

Vous êtes sur :
https://cuy.be/cours/jvs/jvs_354_objets_dates_exemples.html

partager sur FaceBook...           consulter sur FaceBook...

 

copyleft
Des liens ne fonctionnent plus ?
Avez-vous des suggestions ?
des commentaires, des corrections, un encouragement... ?
Pour info : Non, il n'y a pas de version papier ou DOC, PDF, etc. de ces notes.


Envoyez-moi un E-Mail (cuy(point)w(at)skynet(point)be)

Attention (at) signifie @ et (point) signifie .

Accueil CUY = See you why?

Compteur gratuitEasyCounter     BelStat Monitored by BelStat - Your Site Counts
La 1 000 000e page a été visitée le 21 mai 2010.
La 2 000 000e page a été visitée ce 18 mars 2012, vers midi.
La 3 000 000e page a été visitée ce 7 janvier 2014 entre 18 h et 18 h 45,
La 4 000 000e page a été visitée ce 5 juin 2015 entre 15 h 49 et 15 h 52,
La 5 000 000e page a été visitée ce 29 aout 2017 après 23 h 30,
Et la 6 000 000e page visitée, trop tôt pour y penser ?
 
et, d'après BelStat, CUY est visité surtout en semaine, peu le weekend...
moins et irrégulièrement pendant les vacances :

visites sur 3 mois, de la mi octobre 2013 à la mi janvier 2014.
 
La 3 333 333e page visitée a eu lieu ce mardi 10 juin 2014, en début d'après midi...
La 3 666 666e page visitée a eu lieu ce dimanche 28 decembre 2014, vers 16 h...
Un tiers de million de pages visitées en 154 jours cela fait une moyenne de 2165 pages visitées par jour...
Deux tiers de million de pages visitées en 355 jours soit une moyenne de 1878 pages visitées par jour...
et seulement 1195 pages visitées quotidiennement pendant les vacances estivales
de la mi juin à la mi septembre 2014

Vous voulez lire quelques messages reçus ?
quelques encouragements ?
Cliquez ici


Fin septembre 2009, installation de ce compteur
qui ne compte chaque nouvel ordinateur visiteur qu'une seule fois
free counter
 
m-à-j du 22/11/2021 :

Depuis cette fin septembre 2009, parmi les 210 pays (sur 274 drapeaux connus) qui nous ont visité,
voici les 100 pays qui nous visitent le plus, 
Nos petits visiteurs, classés par date de visite, où un seul ordi nous a visité, sont :
199. Turkmenistan (TM May 10, 2017) ; 200. Lesotho (LS March 1, 2017) ;
201. Turks and Caicos Island (TC January 18, 2016
202. Cook Islands (CK September 19, 2015)  203. Faroe Islands (FO January 27, 2015
204. Virgin Islands American (VI November 12, 2014) ;
205. Belize (BZ September 29, 2014) ;206. Eswatini - Swaziland (SZ July 21, 2014) ;
207. Grenada (GD April 3, 2014) ; 208. Timor-Leste (TI March 29, 2014) ;
209. American Samoa (AS December 26, 2012) ; 210. Guyana (GY November 5, 2010).