Table des matières
Javascript
Quelques fonctions Javascript
alert (“texte à afficher”)
document.write (“texte à afficher”)
- Initialisation de l'objet heure par
heure=new date()
. Permet d'en extraire les heures et les minutes par :heure.getHours()
heure.getMinutes()
setTimeout (“fonction()”,150)
indique au navigateur que la fonction doit être appelée au bout de 150 millisecondes.
Les événements
OnLoad
- onUnload
- onMouseOver
- onMouseOut
onFocus
= lors du placement du curseur sur un élément du formulaire.
onBlur
= devient actif lorsqu'on quitte un élément de formulaire (perd le focus)
onChange
= devient actif lorsqu'on quitte un élément de formulaire ET que celui-ci a été modifié.
onClick
= activé lorsque l'on clique sur un élément de formulaire.
onSubmit
= se place dans la balise <form> et s'active lorsqu'on clique sur un bouton “submit”
Les Fonctions
Il y a les fonctions prédéfinies du type alert ('message')
et les fonctions que l'on construit soit même, déclarées dans l'en-tête avec la syntaxe suivante :
function bonjour (variable) {alert (variable)}
Les fonctions sont exécutées sur des événements.
Si plusieurs variables sont à passer en paramètre, elles seront alors séparées les unes des autres par des virgules.
Lors de la déclaration des paramètres à la création de la fonction, ceux-ci n'ont pas besoin de guillemets ni apostrophe.
Par contre lors du passage de ceux-ci, il faut les placer entre guillemets ou apostrophe indifféremment.
Les variables
Une variable ne peut être que d'un seul type : nombre ou texte.
C'est à son appel que le type est déterminé et ne pourra pas changer de type par la suite.
Une variable locale est une variable utilisée uniquement dans une fonction.
Elle peut-être passée en paramètre ou bien déclarée dans la fonction avec la commande “var”.
Exemple :
var nom_variable nom_variable ="hello" (variable de type texte) nom_variable = 5 (variable de type nombre)
On utilise le signe + pour concaténer texte et variables lors de l'affichage.
Les variables globales pourront être utilisées par plusieurs fonctions déclarées entre les balises <script ></script >.
Pour cela les variables globales doivent être déclarées (toujours avec “var”) dans l'en-tête juste après <script> en dehors des fonctions.
Opérations mathématiques
Addition : résultat =a+b\\
soustraction - multiplication - division
Valeur arrondie d'un entier a=math.round(b)
Ajouter 1 à une variable : résultat++
Soustraire 1 à une variable : résultat–
Les boucles for et while
for (var i=1;i <=100;i++) {instructions} while (condition) {instructions incrément}
Exécution conditionnelle
if (condition) {instruction}
Les objets standards
Un objet est un ensemble de fonctions et de variables.
En Javascript, les objets standards sont déjà prédéfinis. Une fonction ou une variable d'un objet standard est toujours indiquée avec le nom de l'objet, un point et le nom de la fonction ou de la variable.
L'objet “document” regroupe toutes les fonctions et variables qui ont un rapport avec le document HTML.
document.write (“bla bla”)
→ fonction
document.bgcolor
→ variable
windows.alert(“bla bla”)
→ fonction de l'objet windows.
Les propriétés dans le document :
Il existe trois constantes de type texte qui peuvent uniquement être lues :
document.referrer
→ adresse URL du fichier à partir duquel la page actuelle à été appelée.
document.location
→ adresse URL de la page actuelle.
document.title
→ titre de la page actuelle.
Les images dans le document
c'est l'objet “document” qui permet la gestion des images et chaque image doit être identifiée par un nom :
<img src=“image.gif” name=“photo”>
et c'est donc la variable document.photo.src
qui permettra d'attribuer le graphique image.gif
Exemple de roll-over :
<script> image1=new Image -> déclaration de l'objet image1 image1.src="image1.gif" -> chargement de l'image à l'ouverture de la page sans l'afficher image2=new Image image2.src="image2.gif" </script>
Dans le corps du document
<body> <a href="pages.htm" onMouseOver="document.image.src=image2.src" onMouseOut="document.image.src=image1.src"><img name="image" src="image1.gif"></a> </body>
Les formulaires
Dans le document : document.forms
Dans une page HTML il peut y avoir plusieurs formulaires ⇒ à chaque formulaire est associé un index, 0 pour le 1er … n pour le dernier.
Dans le formulaire chaque champ de saisie devra avoir un nom du type name=nomElement
.
Pour un champ de saisie texte input
on pourra
- lire (ou remplacer) la valeur par :
document.form[0].nomElement.value
- mettre une valeur par défaut :
document.form[0].nomElement.defaultValue
- sélectionner le texte dans un champ de saisie :
document.form[0].nomElement.select()
- placer le curseur dans un champ de saisie :
document.form[0].nomElement.focus()
Pour les listes déroulantes, la liste est définie par un nom et chaque élément de la liste par son index :
document.form[0].nomListe.option[n].value document.form[0].nomListe.option[n].selected document.form[0].nomListe.option[n].selectedIndex
Pour les boutons radio et cases à cocher, lorsque dans un groupe de choix sont utilisés plusieurs éléments comportant le même “name”, les éléments sont différenciés par un index sur le nom :
document.form[0].nomElement[n].checked document.form[0].nomElement[n].defaultChecked
Les chaînes de caractères
l'objet string
Si l'on définie une variable texte “prenom”, alors :
prenom.lenght
= renvoi le nombre de caractères de la variable
prenom.substring
(0, 9) = renvoi les 10 premiers caractères
prenom.toLowerCase
: met tous les caractères en minuscule
prenom.toUpperCase
: met tous les caractères en majuscule
Les objets personnalisés
Si l'on veut par exemple définir l'état civile de plusieurs collaborateurs par un objet :
2 façons de faire :
- Par une fonction
déclaration de la fonction :function etatcivile (nom, age) { this.nom = nom this.age = age }
Ensuite la fonction est appelée lors de la déclaration des variables :
var dupont = new etatcivile (“Michel Dupont”, 43)
On accède ensuite au nom avecdupont.nom
et à l'âge avecdupont.age
- en déclarant librement l'objet :
dupont = new Object dupont.nom="Michel Dupont" dupont.age=43 dupont.hobby="modelisme"
Les tableaux
déclaration d'un tableau : var exemple = new Array
Ainsi les variables suivantes sont disponibles : exemple[1]
, exemple[2]
, exemple[3]
…
Dans un tableau, toutes les variables doivent être du même type (nombre ou texte)
Possibilité de créer un tableau à double entrée :
var double = new Array double[1] = new Array
ce qui donne les variables suivantes : double[1][1]
, double[1][2]
, double[1][3]
…