Pense bête JavaScript
Symboles
< = <
> = >
Apostrophe
ex l'Heure
Saisir l\'Heure (avec anti slash)
Arrondi de calculs
Math.round(document.formulair.m2_ht.value * 100.00) / 100.00 ;
Les balises texte (hauteur caractéres)
<h1> ..... </h1>
h1 = taille 24 points
h2 = taille 18 points
h3 = taille 14 points
h4 = taille 12 points
h5 = taille 10 points
h6 = taille 8 points
Boite d’Alerte
Apostrophe dans 1 boite d’alerte
Ex . s’\écrire
Saut de ligne
\n
Boucle
i variant de 0 à 100 inclus par pas de 1
for (i = 0 ; i <= 100 ; i = i +1) ou i++
Bouton
dans body
<FORM>
<INPUT TYPE="text" NAME="email" SIZE=25 VALUE="Votre email ici !">
<INPUT TYPE="button" VALUE="S'abonner" onClick="this.form.submit();this.disabled=true;this.value='Patientez...'">
</FORM>
Chaines de caractères
Conversion chaine en nombre
chaine = « 3.14 » ;
entier = parseInt(chaine) ; -à 3
reel = parseFloat(chaine) ; -à 3.14
Attention le 1er caractère a l’indice 0
Découpe de chaine
test = « Il-est-20-Heures » ;
parties = test.split(« -« ) ;
parties[0] = « Il »
parties[1] = « est »
chaine = « azerty » ;
Longueur chaine
long = chaine.length à 6
Le n ème caractère d’une chaine
car = chaine.chatAt(1) ; à z
Sous chaine
var date = « 15/08/2000 » ;
jour = date.substring(0,2) ; à 15
mois = date.substring(3,5) ; à 08
annee = date.substring(6,10) ; à 2000
Couleurs (3D)
ThreedDFace Blanc cassé
ThreedDLightShadow Blanc cassé
ThreedDHighLight Blanc
ThreedDDarkShadow Gris foncé
ThreedDShadow Gris clair
Commentaires / Remarques
Dans 1 script
/* ……….. */ ou // pour 1 ligne (idem en PHP)
Dans le body
< !-- …..-->
Cookies
Javascript manipule la propriété cookie de l'objet document (document.cookie="liste-des-attributs-du-cookie").
Voici la liste des attributs d'un cookie:
• Un nom et une valeur (nom=valeur): Le nom permet d'identifier le cookie. Sa
valeur est un texte qui constitue le contenu du cookie.
• Une date d'expiration (expires=date-au-format-GMT): Au format GMT (ex: Tue,
31-Dec-2002 08:00:00 GMT), elle est facultative. Si elle est omise, le cookie
"meurt" à la fin de la session en cours du navigateur. Si elle est spécifiée on
parle d'un "cookie persistant".
• Un chemin d'accès (path=chemin-d-accès): Il indique la partie de l'URL pour
laquelle le cookie est valable.
Une page HTML pourra lire les cookies de ses sur-répertoires jusqu'à la racine
du site:
ex: http://www.domaine.com/repertoire/index.htm lira les cookies des répertoires
http://www.domaine.com/ et http://www.domaine.com/repertoire/
En revanche, elle ne pourra pas lire les cookies de ses sous-répertoires:
ex: http://www.domaine.com/index.php ne pourra pas lire les cookies du
répertoire http://www.domaine.com/repertoire/
Pour qu'un cookie soit accessible depuis tous les répertoires d'un site, il
faudra donc spécifier path="/".
Enfin, si le chemin d'accès est omis, il prendra la valeur par défaut du chemin
de la page HTML qui écrit le cookie, ce qui est dans bien des cas suffisant.
• Un domaine de validité (domain=domaine-de-validité): Il indique le serveur
pour lequel le cookie est valable (ex: www.domaine.com). S'il n'est pas spécifié
il prend la valeur par défaut du domaine de la page HTML qui écrit le cookie, ce
qui est, dans la grande majorité des cas, l'effet recherché.
Pour des raisons de sécurité, il ne semble cependant pas possible (on a essayé),
qu'un site web place des cookies qui seront relus par un autre site.
• Un attribut de sécurité (secure): S'il existe, le cookie ne sera transmis que
si la connexion vers le serveur est sécurisée (protocole HTTPS et non HTTP).
Ecrire
<html>
<head>
<meta http-equiv="Content-Language" content="fr">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Cookie</title>
<script>
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
</script>
</head>
<body>
<p><a onClick=createCookie("pays_jno","Jocelyn",10); href="#">Cookie</a></p>
</body>
</html>
Entier
// Centaine
cent = days_Diff / 100;
cent = Math.trunc(cent);
Lire
<script type="text/javascript" language="JavaScript">
<!--
function getCookieVal(offset)
{
var endstr=document.cookie.indexOf (";", offset);
if (endstr==-1) endstr=document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function LireCookie(nom)
{
var arg=nom+"=";
var alen=arg.length;
var clen=document.cookie.length;
var i=0;
while (i<clen)
{
var j=i+alen;
if (document.cookie.substring(i, j)==arg) return getCookieVal(j);
i=document.cookie.indexOf(" ",i)+1;
if (i==0) break;
}
return null;
}
//-->
</script>
Pour lire un cookie, il suffit maintenant d'appeler la fonction LireCookie
depuis le corps de la page HTML. Voici un exemple de script à insérer entre les
balises <body> et </body>:
<script type="text/javascript" language="JavaScript">
<!--
nbvisites=LireCookie("nombredevisites");
//-->
</script>
Cookies2
Ecrire cookie JavaScript
<script type="text/javascript" language="JavaScript">
<!--
function EcrireCookie(nom, valeur)
{
var argv=EcrireCookie.arguments;
var argc=EcrireCookie.arguments.length;
var expires=(argc > 2) ? argv[2] : null;
var path=(argc > 3) ? argv[3] : null;
var domain=(argc > 4) ? argv[4] : null;
var secure=(argc > 5) ? argv[5] : false;
document.cookie=nom+"="+escape(valeur)+
((expires==null) ? "" : ("; expires="+expires.toGMTString()))+
((path==null) ? "" : ("; path="+path))+
((domain==null) ? "" : ("; domain="+domain))+
((secure==true) ? "; secure" : "");
}
//-->
</script>
Pour écrire un cookie, il suffit maintenant d'appeler la fonction EcrireCookie
depuis le corps de la page HTML. Voici quelques exemples de scripts, à insérer
entre les balises <body> et </body>:
Exemple#1
<script type="text/javascript" language="JavaScript">
<!--
EcrireCookie("dejavenu", "oui");
//-->
</script>
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name,"",-1);
}
Curseur
Hors d’un lien hypertexte qui ne comporte pas le curseur par défaut
< a style = « cursor :hand » … (le curseur main)
Personnalisé
<style = « cursor :url(‘bottle.cur’) » … non reconnu sous
FireFox
Dates
var date_jour = new Date();
var annee = date_jour.getYear();
var date = date_jour.getDate(); // le N° du jour dans le mois
var date = date_jour.getDay(); // le N° du jour de la semaine
var date_txt = date_jour.toLocaleString(); // la date texte norme française
var date_GMT = date_jour; // Date texte norme GMT affichage de l'heure exacte
(prise en compte heures Hiver/Eté)
var date_UTC = date_jour.toUTCString(); // Date texte norme UTC affichage de
l'heure sans prise en compte heures Hiver/Eté
var mois = date_jour.getMonth(); // le N° du mois
var annee_longue = date_jour.getFullYear(); // année sur 4 digits ex. 2007
var heure = date_jour.getHours(); // Heure
var minute = date_jour.getMinutes(); // Minutes
var sec = date_jour.getSeconds(); // Secondes
alert("Date GMT = " + date_GMT + " Date UTC = " + date_UTC);
alert("Date format local = " + date_txt);
Mois et jours
var d1 = date_jour;
var m=new Array(13); // pour 12 mois (les tableaux démarrent à l'indice 0)
m[1]="Janvier"; m[2]="Février"; m[3]="Mars"; m[4]="Avril"; m[5]="Mai";
m[6]="Juin";
m[7]="Juillet";m[8]="Aout"; m[9]="Septembre"; m[10]="Octobre";m[11]="Novembre";
m[12]="Décembre";
var d=new Array(8); // pour 7 jours (les tableaux démarrent à l'indice 0)
d[1]="Dimanche"; d[2]="Lundi"; d[3]="Mardi"; d[4]="Mercredi"; d[5]="Jeudi";
d[6]="Vendredi"; d[7]="Samedi";
var mois=m[d1.getMonth()+1];
var jour=d[d1.getDay()+1];
var date=d1.getDate();
var an=d1.getYear();
if (an<200) an=1900+an;
// On ne prend que les 3 1ers caractères du mois en lettres (Mai ne fait que 3
caractères)
date=jour+" "+date+" "+mois.substring(0,3)+" "+an;
Document.write Multiple
<script>document.write(« Toto » + annee + « encours » + « <br> ») ;</script>
(annee est 1 variable)
eMail
avec sujet (subject) et texte dans le corps (body)
<a title=’envoi eMail’ href='mailto:jnourtier@j-nourtier.net?subject=Pb
annonce&body=Spécifiez ci-dessous le problème rencontré : '>(si problème,
contactez moi)</a>
Ou avec variables
<script language="javascript"> <!--
function mailpage()
{
chaine_mail = "mailto:jnourtier@j-nourtier.net?subject= Erreur Calculatrice ...
" + version;
chaine_mail += "&body= Merci d'indiquer ci-dessous%0A%0AVos remarques relatives
au(x) problème(s) rencontré(s) :";
location.href = chaine_mail;
}
</script>
</font>
<a title="envoi eMail concernant le problème ..." href="javascript:mailpage()">
<font color="#0000FF"><span style="text-decoration: none">
<font size="2" color="#FF0000">en phase de Tests, Merci de nous signaler les
erreurs éventuelles ...</font></span></font></a></b></i><font size="2"
color="#0000FF"><a title="envoi eMail concernant le problème ..."
href="javascript:mailpage()">
</a></font>
</font><font size="2" color="#0000FF">
<b><br>
Fermeture fenêtre
javascript :window.close()
javascript :window.history.back()
Fichiers externes liés
Fichier js
Dans le <head>
<script langage=JavaScript src = « toto.js »></script>
Fichier css (feuille de style)
Dans le <head>
<link href = « toto.css » type=text/css rel=stylesheet>
Focus
Form.Nb_Marche.focus() ;
onLoad = "document.form.adresse.focus";
Fonctions
Déclaration
<script>
function toto_A()
{ …
}
</script>
Appel à plusieurs fonctions
<… onChange = liste_tva() ;calcul_total) …>
Attention pas d’espace autour du ;
IF
|| ou (alt 124)
&& et
== rigouresement égal
!= différent
Attention au signe d’égalité ==
Simple
if (a == 1) window.alert(« a est égal à 1 ») ;
Avec condition - attention aux apostrophes ouvrant { et fermant }
if (a == 1) {
window.alert(« a est égal à 1 ») ;
a = 0 ;
}
else {
…………..
}
Liens hypertextes supprimer le soulignement des liens
Pour supprimer le soulignement des liens hypertexte, ajoutez simplement dans
l'entete de la page :
<STYLE>
A {text-decoration:none}
</STYLE>
Majuscules / minuscules
var chaine = « Toto » ;
maj = chaine.toUpperCase() ; --> TOTO
min = chaine.toLowerCase() ; --> toto
Math
Math.round() Arrondi à l’entier le plus proche
Math.ceil() Arrondi à l’entier supérieur
Math.floor() Arrondi à l’entier inférieur
Modulo 12 % 5 à2
12/5 = 2.4 0.4 x 5 = 2
Opérateurs de comparaison
!= différent
|| et (alt 124)
== rigouresement =
PopUp
<!-- DEBUT DU SCRIPT
-->
<A HREF="#" onClick="window.open('toto.gif','_blank','toolbar=0, location=0,
directories=0, status=0, scrollbars=0, resizable=0, copyhistory=0, menuBar=0,
width=400, height=300');return(false)">hello affiche</A>
<!-- FIN DU SCRIPT -->
<a href="page.htm" onclick="window.open(this.href); return false;">
javaScript :window.close()
javaScript :top.close()
javaScript :PopupImage (…)
Switch
cent = days_Diff / 100;
cent = Math.trunc(cent);
switch(cent)
{
case 1:
document.write('<img border="0" src="Nb_jours-color/J-01.jpg" height="40">');
break;
case 2:
document.write('<img border="0" src="Nb_jours-color/J-02.jpg" height="40">');
break;
default:
}
Texte
Forcer texte cellule Tableau en justifié
<td style= »text-align=justify »> …