Discussion :

[Vincent Heude]

Bonjour, c'est ma première visite sur ce forum car je découvre JS.

J'ai récupéré le code suivant permettant d'indiquer la date de dernière mise à jour de mon site.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script language="javascript" type="text/javascript">
//<![CDATA[
<!--
var derniereModif=document.lastModified;
var dateModif = new Date(derniereModif);
var jour = dateModif.getDate();
var mois=dateModif.getMonth()+1;
var annee=dateModif.getFullYear();
var heures=dateModif.getHours();
var minutes=dateModif.getMinutes();
 
document.write('<font color=#7a7a7a>  Dernière mise à jour le : <\/font>');
document.write(jour+"/"+mois+"/"+annee+" à "+heures+":"+minutes );
//-->
//]]>
</script>

Cela fonctionne mais, si "dernière mise à jour" est bien en gris, la date elle-même est en noir.

j'ai essayé d'inclure un : '<font color=#7a7a7a> et <\/font>' dans la ligne des variables mais cela ne fonctionne pas

Une erreur de syntaxe ou autre chose ?

merci d'avance

[SylvainPV]

La balise <font> est dépréciée depuis HTML5, utilise plutôt une règle CSS
Aussi, évite document.write qui elle aussi n'est plus du tout utilisée.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<span class="lastModified"></span>

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

.lastModified { color: #7a7a7a; }

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var dateModif = new Date(document.lastModified);
var jour = dateModif.getDate();
var mois=dateModif.getMonth()+1;
var annee=dateModif.getFullYear();
var heures=dateModif.getHours();
var minutes=dateModif.getMinutes();
document.querySelector(".lastModified").innerHTML = "Dernière mise à jour le : "+jour+"/"+mois+"/"+annee+" à "+heures+":"+minutes;

[Vincent Heude]

Bonjour et merci pour ta réponse

Selon ton conseil, voici ce que j'ai fait :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<span class="lastModified"></span>
 
<script language="javascript" type="text/javascript">
//<![CDATA[
<!--
var dateModif = new Date(document.lastModified);
var jour = dateModif.getDate();
var mois=dateModif.getMonth()+1;
var annee=dateModif.getFullYear();
var heures=dateModif.getHours();
var minutes=dateModif.getMinutes();
 
document.querySelector(".lastModified").innerHTML = "Dernière mise à jour le : "+jour+"/"+mois+"/"+annee+" à "+heures+":"+minutes;
//-->
//]]>
</script>

Tout fonctionne bien sauf la couleur (le code css)
je ne sais pas où le mettre et avec quelle syntaxe
Est-ce à l'intérieur de la boucle JS ou bien dans la boucle HTML
J'ai essayé les 2 mais le texte disparait !

Précision : je construis ce site avec "Webacappella" qui me permet de créer des zones html dans mes pages. Je ne sais pas comment déclarer un code css à l'intérieur de la zone. Elle porte un nom : "dernièreMAJ" en l'occurence. Faut-il utiliser ce nom comme balise ?

Je vais voir avec eux mais si tu as une idée, elle sera la bienvenue

Merci d'avance

[Vincent Heude]

j'ai trouvé !!

Voici le code qui fonctionne :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<span class="lastModified"></span>
<style type="text/css">
.lastModified { color: #7a7a7a; }
</style>
<script language="javascript" type="text/javascript">
//<![CDATA[
<!--

var dateModif = new Date(document.lastModified);
var jour = dateModif.getDate();
var mois=dateModif.getMonth()+1;
var annee=dateModif.getFullYear();
var heures=dateModif.getHours();
var minutes=dateModif.getMinutes();
document.querySelector(".lastModified").innerHTML = "Dernière mise à jour le : "+jour+"/"+mois+"/"+annee+" à "+heures+":"+minutes;
//-->

//]]>
</script>

j'ai mis en rouge ce qui manquait

cela fonctionne mais peux-tu me dire si ce code est "propre" ?
Ou bien s'il peut-être amélioré

Merci encore

[thelvin]

cela fonctionne mais peux-tu me dire si ce code est "propre" ?

En HTML certainement pas, on ne met pas des styles où on veut. Et on évite aussi avec les script. Ils doivent être entre <head> et </head> au début du document.

... Mais en ce qui me concerne, j'ignore comment Webacappella et ses "zones" fonctionnent.

[Vincent Heude]

Quelle différence entre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<span class="lastModified" style="color:#7a7a7a;"></span>

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<span class="lastModified"></span>
<style type="text/css">
.lastModified { color: #7a7a7a; }
</style>

l'ai-je bien écrit ?

[Invité]

Pour cela, rien ne vaut un tuto :

• Premiers pas avec les CSS

[SylvainPV]

Personnellement je considère le code inline comme une très mauvaise pratique, tout comme les codes JavaScript en inline sur les listeners d'évènements. Externaliser les CSS dans un fichier permet de :
- éviter de mélanger les langages au sein d'un même fichier
- utiliser toutes les capacités des sélecteurs CSS pour bien souvent réduire significativement la taille du code
- gérer la mise en cache des styles séparément des pages HTML
- gérer plus facilement la mise en place de thèmes ou de feuilles de styles personnalisées par média

Sincèrement, on a tout à gagner à externaliser CSS et JavaScript dans des fichiers à part.

[Watilin]

J'apporte mes 5 centimes :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script language="javascript" type="text/javascript">
//<![CDATA[
<!--

var dateModif = new Date(document.lastModified);
var jour = dateModif.getDate();
var mois=dateModif.getMonth()+1;
var annee=dateModif.getFullYear();
var heures=dateModif.getHours();
var minutes=dateModif.getMinutes();
document.querySelector(".lastModified").innerHTML = "Dernière mise à jour le : "+jour+"/"+mois+"/"+annee+" à "+heures+":"+minutes;
//-->

//]]>
</script>

Sans entrer dans les histoires de goût personnel, utiliser du code déprécié est, sans hésitation possible, quelque chose de pas propre. L'attribut language est déprécié depuis 1999.
La section CDATA était un bricolage pour coller à une maladresse du standard XHTML, elle n'est pas nécéssaire avec HTML5. Là nous avons en plus une double précaution car cette section CDATA est doublée d'un commentaire HTML Je ne crois pas que ça soit encore utile à quelque chose depuis la mort de Netscape et IE5.

Vincent Heude, si je n'avais qu'un seul conseil à te donner ce serait celui-là : quand tu cherches une doc JavaScript sur le Net, regarde la date ! JavaScript évolue vite et les docs périmées sont (trop) nombreuses.

[Vincent Heude]

Merci à tous pour votre aide

Comme je l'ai écrit dans le 1er message, je découvre ces jours-ci html et JS.

Donc j'ai du chemin à parcourir pour atteindre ne serait-ce que le niveau débutant

Bonne journée