I.

NOTION D’OBJET
Un objet est une donnée informatique regroupant les caractéristiques d’une entité existante.
Chaque objet est caractérisé par plusieurs notions :
✓ Les attributs qui caractérisent l’objet
✓ Les méthodes qui caractérisent ses comportements
✓ L’identité qui permet de distinguer un objet des autres
Exemples d’objet de Javascript :
▪ Le navigateur utilisé pour voir un page est un objet qui s'appelle "navigator"
▪ La fenêtre du navigateur dans laquelle s'affiche une page HTML, se nomme "window"
▪ La page HTML elle-même est un objet appelé "document"
▪ Un formulaire à l'intérieur d'un "document" est aussi un objet appelé "form"
▪ Un lien hypertexte dans une page HTML est un objet appelé "link"
Remarques :
R1): les objets sont juxtaposés ou imbriqués les uns dans les autres
R2) Chaque objet possède un nom, des attributs et (éventuellement) des méthodes
R3) Accès à un objet par la notation "point" : nom_de_l'objet.nom_de_la_propriété
Exemples :o.monTexte.value
document.form.radio[0].checked
window.status
• lit ou modifie la "status bar" (en bas de la fenêtre)
window.status = "le site le plus cool";
• Le code suivant montre comment changer la status bar lorsque l’utilisateur glisse la souris
sur un lien
• marche uniquement si votre Navigateur l’autorise ...
<a href="edutechwiki.unige.ch/en"> onmouseover="status=’Consultez
EduTechWiki’; return true;">EduTech Wiki</a>
window.print()
• envoie le contenu de la fenêtre sur l’imprimante
window.print();
R4) Les objets de JavaScript, sont des entités appartenant au monde des navigateurs et du langage
(soit pré définis dans le langage ; soit créés par le programmeur)
R5) la création d’un objet se fait avec l’instruction new de la manière suivante :
var nomobjet= new ModèleObjet() ; Exemple : var date = new Date();
II. CONTROLE DE SAISIE DANS UN FORMULAIRE
Les données dans un formulaire doivent être contrôlées avant leurs envoies. Ainsi contrôler la
saisie dans un formulaire revient à s’assurer que les données saisies sont correctes.
Une expression régulière est une chaine de caractère qui décrit, selon une syntaxe précise un
ensemble de chaines de caractères possibles. Javascript permet de générer ce genre d’objet.
1) Contrôle de saisie utilisant une expression régulière
Une expression régulière (regex) est un modèle qui peut être utilisé pour faire correspondre
des combinaisons de caractères dans des chaînes de texte, de sorte qu'elles sont idéales pour
la validation de formulaires.
a) Description des expressions régulières
La description du modèle est faite selon les règles suivantes :
• a — correspond à un caractère qui doit être un a (ni b, ni aa, etc.)
• abc — correspond à a , suivi de b , suivi de c .
• a* — correspond au caractère a, absent ou présent plusieurs fois ( + correspond à un
caractère une ou plusieurs fois).
• [^a] — correspond à un caractère qui n'est pas un a.
• a|b — correspond à un caractère qui est a ou b.
• [abc] — correspond à un caractère qui est a, b ou c.
• [^abc] — correspond à un caractère qui n'est pas a, b ou c.
 • [a-z] — correspond à tout caractère de la plage a–z, en minuscules seulement (utilisez
[A-Za-z] pour minuscules et majuscules et [A-Z] pour les majuscules uniquement).
• a.c — correspond à a, suivi par n'importe quel caractère, suivi par c.
• a{5} — correspond à a, 5 fois.
• a{5,7} — correspond à a, 5 à 7 fois, mais ni plus, ni moins.
Vous pouvez utiliser des nombres ou d'autres caractères dans ces expressions, comme :
• [ -] — correspond à une espace ou un tiret.
• [0-9] — correspond à tout nombre compris entre 0 et 9.
Vous pouvez combiner cela pratiquement comme vous l'entendez en précisant les
différentes parties les unes après les autres :
• [Ll].*k — Un seul caractère L en majuscules ou minuscules, suivi de zéro ou plusieurs
caractères de n'importe quel type, suivis par un k minuscules.
• [A-Z][A-Za-z' -]+ — Un seul caractère en majuscules suivi par un ou plusieurs
caractères en majuscules ou minuscules, un tiret, une apostrophe ou une espace. Cette
combinaison peut s'utiliser pour valider les noms de villes dans les pays anglo‑saxons ;
ils débutent par une majuscule et ne contiennent pas d'autre caractère. Quelques
exemples de ville de GB correspondant à ce schéma : Manchester, Ashtonunder-lyne et
Bishop's Stortford.
• [0-9]{3}[ -][0-9]{3}[ -][0-9]{4} — Un schéma pour un numéro de téléphone intérieur
américain — trois chiffres, suivis par une espace ou un tiret, suivis par trois nombres,
suivis par une espace ou un tiret, suivis par quatre nombres. Vous aurez peut-être à
faire plus compliqué, car certains écrivent leur numéro de zone entre parenthèses, mais
ici il s'agit simplement de faire une démonstration.
b) Utilisation d’une expression régulière dans un script
Elle se fait en 02 étapes :
- Création de l’objet
re=/exp/drapeau ou re=new RegExp("exp","drapeau")
• exp : le motif (^ et $,.,[a-z],\d,\w,*,+,?,{n},{n, m},...)
• Drapeau : le comportement (g:toutes les occurrences,i:non sensible à la case,gi)
- Utilisation de l'objet :
– ses méthodes:
• re.exec(chaine) : renvoie un tableau avec les occurrences du motif trouvées dans chaine
• re.test(chaine) : renvoie true/false si le motif st trouvé dans chaine,
– Les méthodes de String
• String.match(re), String.split(re), ..
Exemple : var reg = /^[a-z0-9._-]+@[a-z0-9]{2,}[.][a-z]{2,3}$/
If (reg.exec(email)!=null) alert(« l'adresse est valide »)
III. CONTROLE DU TABLEAU HTML AVEC JAVASCRIPT
1) Accéder au tableau HTML à partir de son identifiant
var tab=document.getElementById("identifiant") ;
2) Accéder aux lignes du tableau
On utilisera la méthode rows du tableau pour obtenir toutes les lignes du tableau
Exemple : var lignes=tab.rows ; permet de ranger dans lignes toutes les lignes du tableau
tab. La première ligne est lignes[0]
3) accéder aux cellules d’une ligne
On utilisera la méthode cells de la ligne du tableau pour obtenir toutes les cellules d’une ligne
Exemple : var cellules1=lignes[0].cells ; permet de ranger dans cellules1 toutes les cellules
de la première ligne du tableau tab. La première cellule de la première ligne est cellules1[0]
4) Accéder au contenu d’une cellule
On utilisera la méthode innerHTML de la cellule pour accéder à son contenu.
Exemple : cellules1[0]. innerHTML= "nouvelle valeur ou code html" ;