Outils pour utilisateurs

Outils du site


tic:javascript

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 :

  1. 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 avec dupont.nom et à l'âge avec dupont.age

  2. 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]

tic/javascript.txt · Dernière modification : 2016/08/25 13:16 de bloop