Séance 4
12 février 2007
JavaScript est un langage de scripte interprété par les navigateurs modernes. JavaScript utilise la syntaxe de Java (inventé par SUN).
Attention : JavaScript n'est pas Java!
JavaScript est encastré dans le code "html". Un scripte est facilement inclue dans un page html.
Le "wrapper" classique pour JavaScript est :
<script type="text/javascript">JavaScript est un langage à objet, faiblement typé.
<!-- // -->
</SCRIPT>
Exemple S4.1.html Un Petit Script
<!-- Execute this script -->
<HTML>
<HEAD>
<TITLE>Un Petit Script</TITLE>
</HEAD
<BODY BGCOLOR=WHITE>
<H1>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
<!-- Projection des navigateurs avant Netscape 3.0
document.write(navigator.a
PName + " " + navigator.a
PVersion)
// Fin du zone protege -->
</SCRIPT>
</H1>
<NOSCRIPT>
<H2>Cet page exige JavaScript</H2>
<A
HREF="http://home.netscape.com">Netscape</A>
</NOSCRIPT>
<A HREF="S4.11.html">S4.11.html</A>
</BODY>
</HTML>
On peut créer un boite avec un message d'alerte avec "alert".
Java Permet les if () else; du style "C". On peut rediriger l'utilisateur a une autre script avec l'attribut "location" de l'objet "window" : window.location
Exemple d'un ALERT
Exemple S4.2.html
</TITLE>
</HEAD>
<BODY BGCOLOR=WHITE>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
<!-- Projection des navigateurs avant Netscape 3.0
//Navigator indique le Navigateur courant.
if(navigator.appName == "Netscape")
{
alert("Netscape Detected. Tres Bien!")
// window est le fenetre courant
// window.location est son address.
window.location = "bienvenue.html"
}
else
{
alert("Vous n'est pas sur Netscape!")
}
// Fin du zone protege -->
</SCRIPT>
<H1> Alert</H1>
<NOSCRIPT>
<H2>Cet page exige JavaScript</H2>
<A
HREF="http://home.netscape.com">Netscape</A>
</NOSCRIPT>
</BODY>
</HTML>
avec le script bienvenu.html
Bienvenu avec Netscape</TITLE>
</HEAD>
<BODY BGCOLOR=WHITE>
<H1> Netscape est bienvenu ici</H2>
</SCRIPT>
<A HREF="S4.2.html">S4.2.html</A>
</BODY>
On peut définir les fonctions JavaScript qui sont déclenché par les evenements.
Par exemple un fonction de changer le couleur du fond est
Exemple S4.3.html
<HTML>
<HEAD>
<TITLE>Exemple d'un fonction</TITLE>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
<!-- Hide script from older browsers
function setColor(colorstr)
{
document.bgColor = colorstr;
}
// End hiding script from older browsers
-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=WHITE>
<H2>
Changer le couleur du fond
</H2>
<HR>
<FORM>
<INPUT TYPE="button" VALUE="blanc"
onClick="setColor('#ffffff')">
<INPUT TYPE="button" VALUE="gris"
onClick="setColor('#c0c0c0')">
<INPUT TYPE="button" VALUE="bleu
ciel" onClick="setColor('#64bae2')">
<INPUT TYPE="button" VALUE="citron"
onClick="setColor('#fff8b9')">
<INPUT TYPE="button" VALUE="mauve"
onClick="setColor('#c0c0f0')">
<INPUT TYPE="button" VALUE="peche"
onClick="setColor('#ffcb9f')">
<INPUT TYPE="button" VALUE="rouge"
onClick="setColor('#ff000')">
<INPUT TYPE="button" VALUE="vert"
onClick="setColor('#00ff00')">
<INPUT TYPE="button" VALUE="bleu"
onClick="setColor('#0000ff')">
</FORM>
<A HREF="S4.11.html">S4.11.html</A>
</BODY>
</HTML>
Exemple S4.4.html
On peut ouvrir un fenêtre avec la méthode window.open() de la classe window.
<HTML>
<HEAD>
<TITLE>Window Test</TITLE>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
<!-- Hide script from older
browsers
function newWindow()
{
imgWindow = window.open('Skier.mov.gif',
'imgWin', 'width=175,height=150')
}
// End hiding script from old
browsers -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=WHITE>
<CENTER><H1>Skiing
in Grenoble</H1>
<H3>Its time for Spring
Skiing</H3>
<A HREF="javascript:newWindow()">Click
here</A> to see why.
</CENTER></BODY>
</HTML>
JavaScript peut être utilisé pour le
calcul ou la
vérification d'information pendant la saisie avec une
formulaire.
Exemple S4.10.html
En lieu d'exiger que l'utilisateur tape "submit", on peut
permettre la dépacement par menu.
Exemple S4.11.html