| |||||
|
L'objetLe but de cette section n'a pas pour ambition de vous faire connaître la programmation orientée objet (POO) mais de vous donner une idée de ce qu'est un objet, concept nécessaire à la création de scripts Javascript. Le Javascript traite les éléments qui s'affichent dans votre navigateur comme des objets, c'est-à-dire des éléments
Cette notion semble floue pour l'instant mais voyons voir cela sur un exemple concret: Imaginez un arbre dans un jardin comportant une branche sur laquelle se trouve un nid. On suppose la hiérarchie d'objets est définie comme ceci:
jardin.arbre.branche.nid Contrairement au nid situé sur la balançoire: jardin.balançoire.nid Imaginez maintenant que l'on veuille changer la couleur du nid (dans l'arbre) pour le peindre en vert, il suffirait
de taper une commande du genre:
C'est donc ainsi que l'on représente les objets en Javascript, à la seule différence que ce n'est pas un jardin qui est représenté sous forme d'objets mais la fenêtre de votre navigateur...
Les objets du navigateurJavascript divise la page du navigateur en objets, afin de vous permettre d'accèder à n'importe lequel d'entre-eux et de pouvoir les manipuler par l'intermédiaire de leurs propriétés. On commence généralement par l'objet le plus grand (celui contenant tous les autres) puis on descend dans la hiérarchie jusqu'à arriver à l'objet voulu!
Prenez par exemple le bouton (appelé checkbox) et le champ de texte suivants:
Le bouton checkbox a entre autre une propriété checked, qui retourne la valeur 1 si le bouton est coché, 0 dans le cas contraire. Cliquez sur le bouton checkbox pour comprendre ce qu'il est possible de faire grâce à ces propriétés. Ainsi le formulaire form1 a comme code HTML : <form name="form1"> <br><input type="checkbox" name="checkbox" onClick="ModifChamp();return true;"> <br><input type='TEXT' name='champ_text' value='Essai du javascript' size='24'></form> Et la fonction javascript associée au bouton checkbox est :
<script language="Javascript">
<!--
function ModifChamp()
{
if (document.forms["form1"].checkbox.checked)
{document.forms["form1"].champ_text.value='Bouton coché'}
else
{document.forms["form1"].champ_text.value='bouton non coché'}
}
// -->
Le champ de texte a par exemple comme propriétés:
Par exemple, l'appui sur les boutons suivants permet de modifier la propriété suivante: window.document.forms["form2"].text.value (c'est-à-dire le texte associé au champ de texte que l'on a nommé champ_text dans le formulaire ci-dessous nommé form2)
Création d'un objetCréer un objet, pour chaque objet, on utilise unr fonction particulière nommée constructeur, qui permet de créer un nouvel objet. Ainsi Java script dispose d'une fonction prédéfinie, string qui permet de créer un objet string. Ce qui fait que vous pouvez créer une variable de chaîne de la manière suivante :Prenom = new String("Martin"); le mot clé new demande à Java Script de créer un nouvel objet ou si vous aimez mieux instance de l'bojet String. Cette instance aurala valeur MARTIN et sera stocké dans la variable PRENOM Cette syntaxe peut-être utiliser pour créer un objet ARRAY(tableau), objet date ou même des objets personnalisés. WithLe mot clé WITH permet de simplifier la quantité de code à écrire. Il permet de spécifier un objet sur lequel nous voulons apporter des changements. Il nous reste par la suite de disposer des accolades et d'inclure à l'intérieur de ces accolades les instruction désirées.Voici un exemple pour bien vous situer dans le contexte. with (prenom) { window.alert("Longueur du prénom : " + length); toUpperCase(); } En programmation JavaScript vous retrouverez très souvent le mot THIS Ce mot-clé indique l'élément actif. [ TOP ] |
||||