Vous êtes sur la page 1sur 49
Année universitaire :2014-2015 Cours: Développement Web Enseignants : Mme Z. CHANNOUF 1

Année universitaire :2014-2015

Cours: Développement Web
Cours: Développement Web

Enseignants : Mme Z. CHANNOUF


Sommaire
Sommaire

Introduction à JavaScript Où placer le code Javascript

Types, variables et opérateurs

Possibilités d’affichage en Javascript

Structures de contrôle

Fonctions en Javascript

Classe et objet

Événements en JavaScript

 Structures de contrôle  Fonctions en Javascript  Classe et objet  Événements en JavaScript
Introduction à JavaScript Types de langages Deux types:  Un langage client-side : les scripts

Introduction à JavaScript

Types de langages

Deux types:

Introduction à JavaScript Types de langages Deux types:  Un langage client-side : les scripts sont

Un langage client-side : les scripts sont exécutés par le navigateur chez l'internaute (le client).

Un langage server-side : les scripts sont exécutés

par le serveur Web. C'est le cas des langages

comme le PHP.

Un script server-side va s'occuper de « créer » la page Web qui sera envoyée au navigateur. Ce

dernier va alors afficher la page puis exécuter les

scripts client-side tel que le JavaScript.

Introduction à JavaScript 5

Introduction à JavaScript

Introduction à JavaScript 5
Introduction à JavaScript  JavaScript est un langage de programmation de scripts principalement utilisé dans

Introduction à JavaScript

JavaScript est un langage de programmation de scripts principalement utilisé dans les pages

web interactives côté client.

utilisé dans les pages web interactives côté client.  C’est un langage orienté objet inspiré de

C’est un langage orienté objet inspiré de nombreux langages dont Java mais il reste

très différent de celui-ci.

Le langage a été créé en 1995 par Brendan Eich, membre de la fondation Mozilla,
Le langage a été créé en 1995 par Brendan Eich, membre
de la fondation Mozilla, pour le compte de Netscape
Communications Corporation.
Introduction à JavaScript Pourquoi JavaScript et  Simple interprétable les langages de par programmation 
Introduction à JavaScript
Introduction à JavaScript

Pourquoi JavaScript

et

Simple

interprétable

les

langages

de

par

programmation Permet une interactivité au Web

Contrôle des valeurs saisies dans un formulaire

Exécution

des valeurs saisies dans un formulaire  Exécution lors de la d’événement survenue (chargement, utilisation

lors

de

la

d’événement

survenue

(chargement, utilisation de la souris, etc.)

Les scripts populaires sont: Javascript, VBScript, JScript, etc

Introduction à JavaScript JavaScript ≠ Java ◦ java : véritable langage de programmation, compilé, code
Introduction à JavaScript
Introduction à JavaScript

JavaScript Java

java : véritable langage de programmation, compilé,

◦ java : véritable langage de programmation, compilé, code protégé, typage fort, objet (classes, instances,

code protégé, typage fort, objet (classes, instances,

héritage

)

JavaScript : facile à utiliser, typage faible, intégré dans html, interprété, basé sur les objets html

Où placer le code Javascript ? Code Javascript placé dans la page HTML : <script

Où placer le code Javascript ?

Code Javascript placé dans la page HTML :

<script type=text/javascript> … </script>
<script type=text/javascript> … </script>

Importation d'un code Javascript externe (dans le fichier moncode.js) :

<script type=text/javascript src=moncode.js></script>
<script type=text/javascript src=moncode.js></script>
Où placer le code Javascript ? Dans certains cas, l’usage de la balise <SCRIPT> n’est

Où placer le code Javascript ?

Dans certains cas, l’usage de la balise <SCRIPT> n’est pas obligatoire :

Cas des événements : il faut simplement insérer le code à l’intérieur de la

balise HTML comme un attribut de celle-ci.

<BODY onLoad="message()">
<BODY onLoad="message()">

Cas des liens HREF : on peut insérer du code javascript dans un lien href en précisant le mot clé javascript :

<A HREF="javascript:message()">une fonction js</A>
<A HREF="javascript:message()">une fonction js</A>
 Utilisation de la console de debug JavaScript des navigateurs  Très pratiques pour tester

Utilisation de la console de debug JavaScript des navigateurs Très pratiques pour tester la syntaxe JavaScript

Utilisation de la console de debug JavaScript des navigateurs  Très pratiques pour tester la syntaxe
Utilisation de la console de debug JavaScript des navigateurs  Très pratiques pour tester la syntaxe
 

Types,Variables et Opérateurs

Les variables
Les variables

Pas de déclaration de types

Utiliser var pour déclarer les variables (optionnel )

Noms de variables doivent débuter avec une lettre ou un tiret "_ “ et ils sont sensibles à la casse

ou un tiret "_ “ et ils sont sensibles à la casse Exemples : var a;

Exemples :

var a;

var ceciEstUneVariable; var _et_ceci_aussi; var mix12trois; var 2three4five; // Invalide , une variable ne peut commencer par un chiffre !

var a = 1

var v1, v2, v3 = 'hello', v4 = 4, v5; // Attentions aux majuscules/minuscules var case_matters = 'lower'; var CASE_MATTERS = 'upper';



Types,Variables et Opérateurs

Les opérateurs

Arithmétiques :

+ - / * ++ --

< <= == != >= >

+

Comparaison:

Concaténation des chaînes :

Assignation :

Spéciales:

des chaînes :  Assignation :  Spéciales : = ◦ == et != convertissent les

=

== et != convertissent les opérandes de même

type avant la comparaison

=== et !== considèrent ses opérandes inégales si leurs types sont différents

3
3

Types,Variables et Opérateurs

Les opérateurs

>>> 1 + 2

>>> var a = 123;

var b = a++; >>> b

123

>>> a

124

>>> var a = 123; var b = ++a; >>> b

124

>>> var a = 1;

>>> var b = 2;

>>> a + 1

2

>>> b + 2

4

var b = 2; >>> a + 1 2 >>> b + 2 4 >>> a

>>> a + b

3

>>> var c = a + b;

>>> c

3

>>> a

124

>>> var a = 123; var b = a--; >>> b

123

>>> a

122

Types,Variables et Opérateurs Les opérateurs Symbole Description Exemple == Egalité avec conversion de type
Types,Variables et Opérateurs
Les opérateurs
Symbole
Description
Exemple
==
Egalité avec
conversion de type
>>> 1 == 1
True
>>> 1 == 2
false
>>> 1 == '1‘
true
===
Egalité sans
conversion de type
>>> 1 === '1‘
false
>>> 1 === 1
true
Types,Variables et Opérateurs Les types String, Number, Boolean, NaN, Infinity, undefined et null  NaN

Types,Variables et Opérateurs

Les types
Les types

String, Number, Boolean, NaN, Infinity, undefined et null

NaN est le sigle de "Not a Number",

et null  NaN est le sigle de "Not a Number",  INFINITY est un nombre

INFINITY est un nombre qui est trop grand (ou trop petit)

INFINITY, NEGATIVE_INFINITY ou POSIVE_INFINITY

UNDEFINED pour créer une variable sans lui donner une valeur,

elle est de ce type jusqu'à temps qu'on lui donne une valeur

NULL sert à spécifier une variable sans valeur

Types,Variables et Opérateurs l'opérateur typeof  typeof : renvoie un objet de stype String, qui

Types,Variables et Opérateurs

l'opérateur typeof

typeof : renvoie un objet de stype String, qui peut valoir "number", "string", "boolean", "undefined", "object", ou "function"

"undefined", "object", ou "function" >>> var n0; >>>typeof n0 «

>>> var n0; >>>typeof n0 « undefined » >>>var n1 = 1234; >>> typeof n1;

« number »

>>> var n2 = 1.23;

>>> var s = "quelques caractères"; >>> typeof s; « string »

>>>var n3= 2e+3 // nombre avec exposant >>> typeof n3;

« number »

>>> var n4 = 6 / 0;

>>> typeof n2;

>>> n4

« number »

Infinity

>>> typeof 123;

>>> typeof n4

« number »

« number »



Possibilités d’affichage en JavaScript

On peut afficher les données de différentes façons:

L'écriture dans une boîte d'alerte, en utilisant window.alert () .

L'écriture dans la sortie HTML en utilisant

() .  L'écriture dans la sortie HTML en utilisant document.write () .  L'écriture dans

document.write () .

L'écriture dans un élément HTML, en utilisant innerHTML .

L'écriture dans la console de navigateur, en

utilisant console.log () .

Possibilités d’affichage en JavaScript window.alert ()  Vous pouvez utiliser une boîte d'alerte pour afficher

Possibilités d’affichage en JavaScript

window.alert ()
window.alert ()

Vous pouvez utiliser une boîte d'alerte pour afficher les données :. Exemple <!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <p>My first paragraph.</p>

Page</h1> <p>My first paragraph.</p> <script> window.alert(5 + 6); </script>
Page</h1> <p>My first paragraph.</p> <script> window.alert(5 + 6); </script>

<script> window.alert(5 + 6); </script> </body> </html>

Possibilités d’affichage en JavaScript document.write () Exemple <!DOCTYPE html> <html>
Possibilités d’affichage en JavaScript document.write () Exemple <!DOCTYPE html> <html>

Possibilités d’affichage en JavaScript

Possibilités d’affichage en JavaScript document.write () Exemple <!DOCTYPE html> <html>
document.write ()
document.write ()
Possibilités d’affichage en JavaScript document.write () Exemple <!DOCTYPE html> <html>

Exemple

<!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <p>My first
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
 

Possibilités d’affichage en JavaScript

innerHTML
innerHTML

Pour accéder à un élément HTML, JavaScript peut utiliser document.getElementById (id).

L' id est un attribut qui définit l'élément HTML.

Le innerHTML est une propriété qui définit le contenu HTML:

<!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <p>My First
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>

21

Possibilités d’affichage en JavaScript console.log () Exemple <!DOCTYPE html> <html> <body>
Possibilités d’affichage en JavaScript console.log () Exemple <!DOCTYPE html> <html> <body>

Possibilités d’affichage en JavaScript

console.log ()
console.log ()
Possibilités d’affichage en JavaScript console.log () Exemple <!DOCTYPE html> <html> <body>

Exemple

<!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <p>My first
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>
Les structures de contrôle Structures conditionnelles  Conditions: If (condition) instruction If (condition)

Les structures de contrôle

Structures conditionnelles

Conditions:

If (condition) instruction

If (condition) instruction else instruction

Exemple 1: sc simple

instruction else instruction Exemple 1: sc simple var a= 187, b = 173; if(a > b)

var a= 187, b = 173;

if(a > b)

{

text=(‘a est supérieur à b’);

}

Exemple 2 : sc simple var a= 187, b = 173; if(a > b) {
Exemple 2 : sc simple
var a= 187, b = 173;
if(a > b)
{
text=(‘a est supérieur à b’);
}
else{
text=(‘ a est inférieur ou égal à
b’);
}
if(a > b) Les structures de contrôle Structures conditionnelles Exemple 3 : sc imbriquée var

if(a > b)

Les structures de contrôle

Structures conditionnelles

Exemple 3 : sc imbriquée var a= 17, b = 173;

Exemple 4 : switch var grade='A'; switch (grade) { case 'A': text=(‘Professeur’); break; case
Exemple 4 : switch
var grade='A';
switch (grade)
{
case 'A': text=(‘Professeur’); break;
case 'B': text=(‘Assistant’); break;
case 'C': text=(‘Technicien’); break;
case 'D': text=(‘Ouvrier’); break;
default: text=(‘Grade inconnu’)
}

{

text=('a est supérieur à b');

}
}

else if (a<b)

{

text=(' a est inférieur à b');

}

else

{

text=(' a est égal à b');

}

24

 

Les structures de contrôle

Structures répétitives

While (condition) instruction

Do instruction While (condition)

For (initialisation; condition; incrémentation)

instructions

(initialisation; condition; incrémentation) instructions Exemples : Exemple 1: Boucle FOR Exemple 2: Boucle WHILE

Exemples :

Exemple 1: Boucle FOR Exemple 2: Boucle WHILE for (i = 0; i < 10;
Exemple 1: Boucle FOR
Exemple 2: Boucle
WHILE
for (i = 0; i < 10; i++) {
text = “Le nombre est “
+ i+ “\n”;
var text = "";
}
var i = 0;
while (i < 10) {
text += “le nombre
est” +
i+”\n”;
i++;
}
Exemple 3: Boucle DO… WHILE text=""; i=0; do { text += “Le nombre est "
Exemple 3: Boucle DO…
WHILE
text="";
i=0;
do {
text += “Le nombre est " +
i+"\n";
i++;
}
while (i < 10);


Les Fonctions en JavaScript

Syntaxe d’une fonction

Définie préférablement dans la partie <head> surtout avant l’appel de la fonction Syntaxe function nom (arg1, …, argn) { instructions}

Syntaxe function nom (arg1 , …, argn) { instructions}  Appelée dans la partie <body> 

Appelée dans la partie <body>

Syntaxe de l’appel: nom (arg1, …, argn)

Variables déclarées dans une fonction resteront locales à

cette fonction

On pourra utiliser la commande RETURN (optionnel)

<html>
<html>

Les Fonctions en JavaScript

Exemple de déclaration

<head> <script type=text/javascript>

<head> <script type=text/javascript> function Saluer (nom) { document.write (“Bonjour” +

function Saluer (nom)

{ document.write (“Bonjour” + nom) }

</script> </head> <body> < script type=text/javascript >

var votreNom = prompt("Quel est votre nom?");

Saluer(votreNom);

</script>

</body>

</html>



Les Fonctions en JavaScript

Fonctions en fichier externe

On pourra mettre dans un fichier à part:

fonctions.js toutes les fonctions déclarées

Pour les charger et les utiliser dans différentes pages Web

Pour les charger et les utiliser dans différentes pages Web < script type=text/javascript src=fonctions.js >

< script type=text/javascript src=fonctions.js >

</script>

ATTENTION! : Pas de balise <script> dans

fonctions.js

 

Les Fonctions en JavaScript

eval(): interpréte une expression

escape():transforme des signes ASCII en nombres

isFinite():vérifie le domaine numérique de valeurs

 isFinite() : vérifie le domaine numérique de valeurs  isNaN() : vérifie si la valeur

isNaN():vérifie si la valeur n'est pas un nombre

parseFloat():transforme en nombre avec décimales

parseInt():transforme en nombre entier

Number():transforme un objet en nombre

String():transforme le contenu d'un objet en une chaîne de caractères

29

Les Fonctions en JavaScript Fonction eval() eval ("document.write(Bonjour !);") Résultat: Bonjour ! Fonction

Les Fonctions en JavaScript

Fonction eval()

eval ("document.write(Bonjour !);") Résultat: Bonjour !

("document.write(Bonjour !);") Résultat: Bonjour ! Fonction escape() var exemple = "\n\r\t";

Fonction escape()

var exemple = "\n\r\t";

document.write(escape(exemple)); Résultat : %0A%0D%09

//Transforme les caractères de commande avec des codes ASCII de 0 à 31)

// dans leurs valeurs ASCII numériques et cela sous forme hexadécimale

Les Fonctions en JavaScript Fonction isNaN() if(isNaN(x)) { alert(x + " n'est pas un nombre.");

Les Fonctions en JavaScript

Fonction isNaN()

if(isNaN(x))

{ alert(x + " n'est pas un nombre."); }

{ alert(x + " n'est pas un nombre."); } Fonction isFinite() if(isFinite(x + 5 * y))

Fonction isFinite()

if(isFinite(x + 5 * y))

{ alert("Le résultat est un nombre fini.");

//Si la valeur assignée est NaN, //le résultat retourné par isFinite sera false.

}

Les Fonctions en JavaScript Fonction parseFloat() var a = "54 a ", b = "d

Les Fonctions en JavaScript

Fonction parseFloat()

var a = "54 a ", b = "d 54 " , c = 12.5, d = "toto"; document.write(parseFloat(a));

document.write(parseFloat(b));

document.write(parseFloat(c));

document.write(parseFloat(d));

54 NaN 12.5 NaN
54
NaN
12.5
NaN
document.write(parseFloat(d)); 54 NaN 12.5 NaN Fonction parseInt() var a = "54 a ", b = "d
document.write(parseFloat(d)); 54 NaN 12.5 NaN Fonction parseInt() var a = "54 a ", b = "d

Fonction parseInt()

var a = "54 a ", b = "d 54 " , c = 12.5, d = "toto";

document.write(parseInt(a));

document.write(parseInt(b));

document.write(parseInt(c));

document.write(parseInt(d));

54 NaN 12 NaN
54
NaN
12
NaN

32

Les Fonctions en JavaScript Fonction String() var a = 54, b = 44, c =

Les Fonctions en JavaScript

Fonction String()

var a = 54, b = 44, c = 12.5, d = true;

a = String(a); b = String(b); c = String(c);d = String(d);

a = String(a); b = String(b); c = String(c);d = String(d); String String String String document.write(typeof
String String String String
String
String
String
String

document.write(typeof (a)); document.write(typeof (b));

document.write(typeof (c));

document.write(typeof (d));

document.write(typeof (c)); document.write(typeof (d)); Fonction Number() var a = "54 " , b = "d54",

Fonction Number()

var a = "54 " , b = "d54", c = "54d"; document.write(Number(a)); document.write(Number(b)); document.write(Number(c));

54 NaN NaN
54
NaN
NaN
c = "54d"; document.write(Number(a)); document.write(Number(b)); document.write(Number(c)); 54 NaN NaN 33

33

Exercice 1 34

Exercice 1

Exercice 1 34
Solution <HTML> <HEAD> <SCRIPT> var firstNumber, secondNumber,number1, number2, sum; firstNumber =

Solution

<HTML> <HEAD> <SCRIPT> var firstNumber, secondNumber,number1, number2, sum; firstNumber = window.prompt( "Entrer le premier entier", "0" ); secondNumber = window.prompt( "Entrer le deuxieme entier", "0" );

"Entrer le deuxieme entier", "0" ); number1 = parseInt( firstNumber ); number2 = parseInt(

number1 = parseInt( firstNumber );

number2 = parseInt( secondNumber ); sum = number1 + number2;

document.write( "<H1>La somme est " + sum + "</H1>" );

</SCRIPT>

</HEAD>

Exercice 2 36

Exercice 2

Exercice 2 36
Solution 1 <html> <head> <script> function controle() { var test = document. form1 . moninput

Solution 1

<html> <head> <script> function controle() { var test = document.form1.moninput.value; alert("Vous avez tapé : " + test); } </script> </head>

tapé : " + test); } </script> </head> <body> <form name="form1" >

<body> <form name="form1"> <input type="text" name="moninput’’ ><BR> <input type="button" name="bouton" value="Contrôler"

</form>

</body>

</html>

onClick= "controle()">

Solution 2 <html> <head> <script> function controle() { var test = document. getElementById

Solution 2

<html> <head> <script> function controle() { var test = document.getElementById (‘’txt’’).value; alert("Vous avez tapé : " + test); } </script> </head>

tapé : " + test); } </script> </head> <body> <form > <input type="text

<body> <form > <input type="text’’ id= ‘’txt’’><BR> < input type ="button" name="bouton" value="Contrôler"

</form>

</body>

</html>

onClick= "controle()">

Classe et Objet  Une classe est un type qui est la description d’un ensemble

Classe et Objet

Une classe est un type qui est la description d’un ensemble de :

est un type qui est la description d’un ensemble de : ◦ propriétés (les données) et

propriétés (les données) et de

méthodes (les fonctions).

Un objet est une instance de classe (c’est à dire une variable de type classe). On écrira :

o.p pour accéder à une propriété p d’un objet o

o.m() pour appeler une méthode m d’un objet o

Classe et Objet DOM  Lorsqu’un document HTML est chargé dans un navigateur, celui-ci fournit

Classe et Objet DOM

Classe et Objet DOM  Lorsqu’un document HTML est chargé dans un navigateur, celui-ci fournit une

Lorsqu’un document HTML est chargé dans un navigateur, celui-ci fournit une interface DOM (Document Object Model) pour accéder aux objets le

composant :

Object Model) pour accéder aux objets le composant : ◦ Ces objets sont classés de manière

Ces objets sont classés de manière hiérarchique (notion d’arbre).

L’objet le plus haut dans la hiérarchie est l’objet de la

classe window (fenêtre).

Dans cette fenêtre, il y a un document HTML : c’est l’objet document. Donc, L’objet window contient l’objet document.et ainsi de suite

Classe et Objet DOM 41

Classe et Objet DOM

Classe et Objet DOM 41
Classe et Objet DOM 41

41

Classe et Objet DOM 41


Classe et Objet DOM

 Classe et Objet DOM Lorsqu’une page Web est chargée dans un navigateur, Javascript identifie plusieurs

Lorsqu’une page Web est chargée dans un navigateur, Javascript identifie plusieurs objets pour y représenter les informations.

plusieurs objets pour y représenter les informations.  Ces objets sont classés de manière hiérarchique.

Ces objets sont classés de manière hiérarchique. L’objet le plus haut dans la hiérarchie est l’objet de la classe window (fenêtre).

hiérarchique.  L’objet le plus haut dans la hiérarchie est l’objet de la classe window (fenêtre).

42

 Dans Classe et Objet DOM cette fenêtre, document  HTML : c'est l'objet il

Dans

Classe et Objet DOM

 Dans Classe et Objet DOM cette fenêtre, document  HTML : c'est l'objet il y

cette

fenêtre,

document

HTML

:

c'est

l'objet

il

y

a

un

document.

Donc, L'objet fenêtre contient

l'objet document (c’est la notion de

hiérarchie).

l'objet document (c’est la notion de hiérarchie).  Dans ce document, on trouve un formulaire au

Dans ce document, on trouve un

formulaire au sens HTML : c'est l'objet formulaire. Donc, l'objet fenêtre contient un objet document

qui lui contient un objet formulaire

(hiérarchie des objets).

Donc, l'objet fenêtre contient un objet document qui lui contient un objet formulaire (hiérarchie des objets).
Donc, l'objet fenêtre contient un objet document qui lui contient un objet formulaire (hiérarchie des objets).
Classe et Objet DOM  Dans ce document, on trouve trois objets : l'objet radio,

Classe et Objet DOM

Classe et Objet DOM  Dans ce document, on trouve trois objets : l'objet radio, l'objet
Classe et Objet DOM  Dans ce document, on trouve trois objets : l'objet radio, l'objet

Dans ce document, on trouve trois objets :

l'objet radio, l'objet

bouton, et l'objet texte.

Donc, l'objet fenêtre contient :

Le modèle hiérarchique des objets en Javascript.

et l'objet texte. Donc, l'objet fenêtre contient : ◦ Le modèle hiérarchique des objets en Javascript.


Classe et Objet DOM

 Classe et Objet DOM Dans un document HTML, on pourrait donc accéder aux objets de

Dans un document HTML, on pourrait donc accéder aux objets de

la manière suivante :

// Accès à une propriété de l’objet button window.document.form.button.value = "Déterminer"; // Accès à
// Accès à une propriété de l’objet button
window.document.form.button.value = "Déterminer";
// Accès à une méthode de l’objet button
window.document.form.button.focus();
// Accès à une méthode de l’objet window
window.alert("Hello world");
Remarque : l’objet window est souvent facultatif. On ne doit pas forcément préciser son nom
Remarque : l’objet window est souvent facultatif. On ne doit pas
forcément préciser son nom pour utiliser ses méthodes ou ses
propriétés.
Classe et Objet DOM  On recommande d’utiliser la méthode getElementById() pour accéder aux objets

Classe et Objet

DOM
DOM

On recommande d’utiliser la méthode getElementById() pour accéder aux objets par

leur identifiant (attribut ID de l’élément HTML) :

var bouton = document.getElementById(’id_button’); bouton.click(); // pour simuler un clic de souris sur ce bouton
var bouton = document.getElementById(’id_button’);
bouton.click(); // pour simuler un clic de souris sur ce bouton
Les évènements en JavaScript Exemple Le script est exécuté chaque fois que l’événement survient <HTML>

Les évènements en JavaScript

Exemple

Le script est exécuté chaque fois que l’événement survient <HTML> <HEAD>

<SCRIPT LANGUAGE= "Javascript">

<SCRIPT LANGUAGE= "Javascript"> function bienvenue() {alert("Bienvenue à cette

function bienvenue() {alert("Bienvenue à cette page"); } function au_revoir() {alert("Au revoir"); } </SCRIPT>

</HEAD>

<BODY onload='bienvenue()' onunload='au_revoir()'> Salut étudiants ISI </BODY>

</HTML>



Les évènements en JavaScript

Liste des évènements (1)

onAbort (en cas d'interruption)

des évènements (1) onAbort (en cas d'interruption)  onChange (après modification)  onClick (en

onChange (après modification)

onClick (en cliquant)

onDblClick (en double-cliquant)

onError (en cas d'erreur)

onFocus (en activant)

onKeydown (en appuyant sur une touche)

onKeypress (en appuyant sur une touche)

onKeyup (en relâchant la touche)



Les évènements en JavaScript

Liste des évènements (2)

onLoad (en chargeant un fichier) onMousedown (en maintenant la touche de souris appuyée)

onMousedown (en maintenant la touche de souris appuyée)  onMousemove (en bougeant la souris)  onMouseout

onMousemove (en bougeant la souris)

onMouseout (En quittant l'élément avec la souris)

onMouseover (en passant sur l'élément avec la souris)

onMouseUp (en relâchant la touche de souris)

onReset (en initialisant le formulaire)

onSelect (En sélectionnant du texte)

onSubmit (en envoyant le formulaire)

onUnload (en quittant le fichier)