Formation web ECP 25 février 2010
Pré-requis Présentation Formation HTML/CSS Formation PHP (pour l'ajax)
Ce qu'on sait faire Faire des pages web (HTML/CSS) Avoir des pages évolutives (PHP) stocker et consulter des données (SQL)
Ce qu'on veut faire Faire des actions directement sur le navigateur Ajouter une conrmation Vérier un formulaire avant de le soumettre Ajouter de la réactivité
Javascript Présentation Javscript n'est pas Java Langage interprété Langage Orienté Objet Exécution sur le navigateur Porté limité Réglementé par la norme ECMA-262
Mais rien n'est parfait Le comportement peut dépendre du navigateur Le code source est directement accessible L'utilisateur peut désactiver le Javascript Un code Javascript trop lourd peut bloquer le navigateur Trop de Javascript tue le Javascript
Les bases Présentation Exemple Inclue entre les balises <script> Toutes les instruction se terminent par ; Commentaire : // pour une ligne et /* */ pour une paragraphe Le code s'exécute dès que l'interpréteur du navigateur le rencontre
Les variables Des chaines Des entiers Des nombre décimaux Des booléens Des tableaux (Array) des objets Se déclarent en utilisant le mot-clé var
Des opérateurs Un opérateur d'aection : = Des opérateurs arithmétiques : +,-,*,/,% Des opérateurs "raccourcis" : +=,-=,*=,/=,%= Des opérateurs d'incrémentation /décrémentation : ++, Un opérateur de concaténation : + Des opérateurs de comparaison : ==,=>,<=,!= Des opérateurs logique :!,and,or
Des structures Des conditions : if elseif else Des boucles : for,while, do-while Des énumeration : encore for
Des structures Des conditions : if elseif else Des boucles : for,while, do-while Des énumeration : encore for Chaque bloc d'instruction doit être mis entre accolades L'identation est facultative, mais fortement conseillée
For en énumération Prototype
Fonction Présentation Exemple
Porté des variables Les variables n'existe qu'au sein des fonctions où elles sont dénies Exemple
Quelques fonctions utiles alert(message) prompt(message,valeur) conrm(message)
Agir au bon moment But : déclencher une action dans un contexte précis précis Ajout d'un attribut à une balise HTML <balise onevent="script"> Quelques événements courants onclik ondoubleclick onmouseover Intérêt des fonctions
Les concepts Passer d'un code séquentiel à une interactions entre objets Un objet est fabriqué à partir d'une modèle : la classe Un objet possède des méthodes et des propriétés. ON y accès avec le point : objet.propriete ou objet.method(arg)
HTML et la POO Chaque balise HTML est un objet javascript Les objets sont hiérarchisés, comme les balise (DOM) Chaque attribut d'un balise est une propriété Le style associé à la balise est dans la propriété style Fonction document.getelementbyid(str) permet de retrouver la balise qu'on veut
AJAX Présentation AJAX : Asynchronous JavaScript And XML Permet de contacter un serveur distant pour récupérer des informations Juste un objet à maitriser