Les objets de Javascript

A ce stade de notre apprentissage, un peu de théorie ne nous fera pas de mal !
Nous avons vu la fonction document.write() et savons que cette fonction écrit ("write") dans la page web ("document").

Tout ceci pour dire que Javascript est un "langage orienté objet". Késako ?
Cela signifie que avec Javascript vous pouvez influer, modifier ou appeler (on dit adresser) les objets.

Les objets sont des éléments de votre page web que "connaît" Javascript, objets qui respectent une hiérarchie :
--> l'objet WINDOW qui est la fenêtre "générale" de votre page web, parent de
--> l'objet DOCUMENT qui est la page en cours, parent de
--> l'objet FORM (c'est le <form> que vous connaissez), parent de
     --> l'objet TEXTAREA
     --> l'objet BUTTON
     --> l'objet TEXT

Je m'arrête là pour l'instant car les objets sont nombreux ; nous n'avons pas parlé de l'objet navigator, ni de l'objet screen...etc.

Revenons à notre fonction quoi()

<script>
function quoi ()
{
var d="mon_code"
if (document.forme.champ.value==d)
{
alert("Bienvenue chez vous !")
}
else
{
alert ("Votre code est erroné !")
}
}
</script>

 

Il n'y a pas de secret ! Regardez plutôt le code :

<form name="forme">
<input type="text" name="champ">
<input type="button" value="essai" onclick="javascript:quoi()">
</form>

Que déclare la fonction quoi() ? Elle dit que si la valeur de
<input type="text name="champ"> situé dans
<form name="forme"> situé dans
l'objet document c'est-à-dire la page web
est égale à "d" alors on affiche cela, sinon on affiche ceci.

** Il est donc bien important d'adresser les bons objets et de leur affecter un nom (name="") pour que Javascript puisse les identifier (et vous aussi d'ailleurs !).

** dans document.forme.champ, vous avez en fait 1 objet (l'objet text qui s'appelle ici "champ" contenu dans l'objet form qui s'appelle ici "forme" lui-même contenu dans l'objet document).

** dans document.forme.champ.value, nous avons ici ajouté une propriété à cet objet. Un objet peut posséder plusieurs propriétés, c'est-à-dire plusieurs attributs :
- value sert par exemple à évaluer le contenu de l'objet "text"
- length mesure la "longueur" de la chaîne de caractères de l'objet "text"

Exemple :

<script>
function longb()
{
var c=document.formeb.champb.value
if (c.length>=3)
{
alert("Bienvenue chez vous !")
}
else
{
alert ("Votre code est erroné !")
}
}
</script>

Vous voyez ici que nous avons utilisé la propriété "length" pour évaluer la "longueur" de la chaîne de caractère de champb. Tant que la saisie de l'utilisateur ne sera pas égale ou supérieure à 3 caractères, c'est la deuxième fenêtre qui s'affichera ("code erroné").

** Vous aurez noté que le script de la fonction longb() parle de "formeb" et de "champb". En effet, il est préférable pour ne pas dire IMPERATIF lorsque dans la même page vous avez d'une part, plusieurs fonctions ET plusieurs <form> <textarea> ou <text> de les nommer distinctement les uns des autres pour ne pas provoquer des "interférences" entre les fonctions.

** Remarque : nous avons déjà parlé des variables et leur avions jusqu'à maintenant affecté des entiers d=123456, des chaînes de caractères d="comment allez vous ?".

Ici dans la fonction longb() nous avons attribué à c la valeur de document.formeb.champb.value.