docLE JAVA SCRIPT script language="javascript"> Début du code
download 
Plainte Transcription
LE JAVA SCRIPT script language="javascript"> Début du code
Page -1Cours Gabriel Fairfort
LE JAVA SCRIPT
Code
<script language="javascript">
</script>
//
<script language="javascript"
src="nom du fichier script.js">
navigator.appName
navigator.appVersion
Alert("Texte à afficher")
Opérateur de calcul
+, -, *, /, %, =
Opérateur de comparaison
==, <, <=, >, >=, !=
Utilisation de variables
Exemple :
Navigateur= navigator.appName;
prixTot = prix * quantite;
Attention PrixTot est différent de Prixtot
Evénements
Onclick, OnMouseOver, OnMouseOut
OnLoad, OnUnload, OnDblClick
Onfocus = quand le curseur se trouve dans la
zone concernée.
(champ texte d’un formulaire par exemple)
Onblur = quand le curseur n’est plus dans la
zone concernée
Onchange = losque le contenu d’une liste
déroulante d’un formulaire a changé
Fonctions
Function Nom_de_la fonction(paramètre)
{
instruction1 ;
instruction 2 ;
etc..
}
Exemple d'instructions
self.close() fermeture d'une page HTML
Open("fichier HTML","fenêtre",paramètre);
Ouverture d'un fichier HTML
Dans la fenêtre (frame) indiquée
Exemple de paramètres : width=x,
toolbar=yes, status=no, menubar=yes,
scrollbar=yes, height=y , resizable=no...
Exemple
Commentaire
Début du code JavaScript, balise à placer avant la balise <Body>
Fin du code script
Commentaire java script
Permet de placer tout le code correspondant au script dans un fichier texte ayant pour
extension js (ceci permet de cacher aux yeux de l'utilisateur votre code source)
Permet de connaître le nom (appName ) et la version (appVersion) du navigateur
utilisé : Internet explorer, Netscape ou autres...
Permet d'afficher dans une petite fenêtre (Boite de dialogue avec bouton OK) le
texte de votre choix entre guillemets
Addition (+), soustraction (-), multiplication (*), division (/)
Modulo = Reste de la division par (%) , affectation (=)
Résultat : ab reçoit (affectation) la valeur 21
Exemple : ab = (9+1)*2+11%5
Est égale à (==), est supérieur à (>), est supérieur ou égale à (>=),
Est inférieur à (<), est inférieur ou égale à (<=), est différent de ( !=)
Opérateur à utiliser dans une condition avec la fonction IF (si)
Les variables servent a mémoriser une information de manière à la modifier ou à la
réutiliser (majuscule / minuscule important dans le nom des variables)
Exemple
X=2;
la valeur 2 est affectée à la variable X
X=X+1;
la valeur 3 est affectée à la variable X
Onclick au clic de la souris sur un objet (image ou texte)
OnmouseOver au survol de la souris sur un objet
OnMouseOut lorsque l’objet n’est plus survolé
OnLoad au chargement de la page HTML
OnUnload à la fermeture de la page HTML
Evénement à placer après la balise body de la page HTML
Exemple
<html>
Au survole du mot ok
<body>
le mot ‘salut’
<A href="#" onmouseover="alert('salut')">ok</a>
s’affichera dans une
</body>
petite boite de dialogue
</html>
Les fonctions sont à placer après la balise script, et sont appelées après la balise Body à l’aide
d’événements
Exemple de fonction
<html>
<script language="javascript">
//ouverture du fichier indiqué en paramètre
function ouvre(page)
{
alert("Une page HTML va s'ouvrir");
open(page, "fen1","menubar=’no’ ");
}
</script>
<body>
<a href="#" onmouseover="ouvre('home.html')">page de presentation</a>
</body></html>
open("mapage.html","","scrollbar=no,status=yes")
If (Condition)
{
instruction(s) si condition vraie;
}
else
{
instruction(s) si condition fausse ;
}
Instructions conditionnelles (à placer dans une fonction)
Exemple
If (navigator.appName =="Netscape")
{
alert("Vous saviez que Netscape a été racheté par AOL ?");
}
else
{
self.close();
}
Page -2Cours Gabriel Fairfort
Commande For ( )
For (initialisation compteur; test de
fin;incrément)
{
instruction;
}
La commande for, permet de réaliser n fois un certain nombre d'instructions
Exemple: On veut afficher dans une boite de dialogue 1 puis 2 etc jusqu'à 10
For (i=1;i<=10;i=i+1)
i=1 représente la valeur de début
l'instruction sera exécutée tant que i<=10 est vrai
{alert(i);}
i augmente de i+1 à chaque tour
alert(i) affichera 1 au 1er tour, 2 au 2ème...
la commande break permet de sortir d'une boucle avant la fin
window.status="texte à afficher";return true;
window.status permet d'afficher du texte dans la barre d'état du navigateur
Fonction de gestion d’une chaine de caractères
Length = Nbr de caractères dans une chaine
charAt(n) = nème caractère de la chaine de caractères
toUpperCase() = chaine en majuscule
toLowerCase() = chaine en minuscule
substring(x,y) = sous chaine de la chaine située entre
les positions x et y+1
indexOf(sous-chaine,position_début)
permet de connaître la position d’une sous chaine à
partir d’un certain rang
Attention le 1er caractère d’une chaine commence a
l’indice 0, le 2 ème a l’indice 1 etc...
Gestion de chaine de caractères
Exemple :
Ville="New-York" ;
la variable Ville contient le mot "New-York"
alert(Ville.length)
Alert(Ville.charAt(2))
alert(Ville.toUpperCase()) ;
alert(Ville.toLowerCase()) ;
alert(Ville.substring(4,8))
alert(Ville.indexOf("w-Y",0))
affichera :
affichera :
affichera :
affichera :
affichera :
affichera :
Fonction de gestion de la date
new Date() = date courante
getDate() = jour du mois
getDay() = chiffre du jour de la semaine lundi
=1
getMonth() = chiffre du mois (janvier=0)
getYear() = année sous la forme 98 ou 99
getFullYear() = année sous la forme 1999
getHours() = chiffres des heures
getMinutes() = chiffres des minutes
getSeconds() =chiffres des secondes
Affichage d’une image à la place d’une autre
document.images["nom image"].src="fichier"
Exemple : Nous sommes le 28 décembre 1998, il est 15h38 et 10 secondes
madate=new Date()
la variable madate contient la date en cours
alert(madate)
affichera
Mon Dec 28 15:38:10 ......... 1998
alert(madate.getFullYear()) affichera
1998
alert(madate.getDate()) affichera
28
alert(madate.getDay()) affichera
1 (lundi=1, mardi=2 etc...)
alert(madate.getMonth()) affichera
11 (janvier=0, février=1,
Il est possible d’utiliser une variable à la
place de : "nom image" ainsi qu’à la place du
nom du fichier, dans le cas d’une variable ne
pas mettre de guillemets.
document.links[indice].href=’URL’
indice est le N° du lien dans la Page HTML
le 1er lien a pour indice 0,
le 2 ème lien a pour indice 1 etc...
URL est le nom du fichier, du signet ou du site
Internet sur lequel se positionner
Il est possible de faire des liens sur des fichiers
de type son ou vidéo
Exemple
<a href="son.wav">Ecouter</a>
<a href="video.wav">Voir</a>
8 (nbre de caractères du mot)
w (le 3ème caractère a l’indice2)
NEW-YORK
new-york
York
2
...,décembre=11)
alert(madate.getHours()) affichera
etc...
Exemple
<html><script language="javascript">
15
function AfficheImage(img)
{document.images[img].src="image2.gif";}
</script><body><form><img src="image1.gif" name="i1"><p>
<input type="button" value="change" onclick="AfficheImage('i1')">
</form></body></html>
Dans cet exemple l‘image "image1.gif" est affichée à l’écran, au clic sur le bouton
change, l’image "image2.gif" apparaît à la place de l’image d’origine.
Permet de changer l’adresse d’un lien
Exemple dans votre page HTML vous avez le lien suivant
<a href="homepage.html">Sommaire</a>
(c’est le 1er lien de la page il a donc pour indice 0)
En cliquant sur le mot sommaire vous vous retrouverez sur la page : homepage.html
En cliquant sur le mot sommaire vous souhaitez aller sur une autre page.
En javascript créez une fonction dans laquelle vous mettrez
document.links[0].href="page2.html"
Ainsi donc en cliquant sur le mot sommaire vous vous retrouverez, non plus sur la
page homepage.html mais sur la page : page2.html
