La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

Technologies Web JavaScript PhD. Wajdi GARALI INSAT 2010 Cette présentation donnera probablement lieu à des discussions d'où ressortiront des propositions.

Présentations similaires


Présentation au sujet: "Technologies Web JavaScript PhD. Wajdi GARALI INSAT 2010 Cette présentation donnera probablement lieu à des discussions d'où ressortiront des propositions."— Transcription de la présentation:

1 Technologies Web JavaScript PhD. Wajdi GARALI INSAT 2010 Cette présentation donnera probablement lieu à des discussions d'où ressortiront des propositions d'action. Utilisez PowerPoint pour noter ces actions au cours de la présentation. En mode Diaporama, cliquez avec le bouton droit de la souris. Cliquez sur Aide-mémoire. Cliquez sur l'onglet Liste d'actions. Tapez les actions à mesure qu'elles sont proposées. Cliquez sur OK pour fermer la boîte de dialogue. Une diapositive Liste d'actions sera automatiquement créée à la fin de votre présentation.

2 W.GARALI2 Introduction Les programmes Javascript permettent de rendre dynamique une page Web Contrairement à une applet Java qui est un programme compilé, les scripts écrits en Javascript sont interprétés Le Javascript est un langage de script simplifié orienté objet Le Java, représenté par un ou plusieurs fichiers autonomes dont l'extension sera *.class ou *.jar, alors que le JavaScript est écrit directement au sein du document HTML sous forme d'un script encadré par des balises HTML spéciales.balises HTML spéciales

3 W.GARALI3 Introduction Le langage JavaScript a été initialement élaboré par Netscape en association avec Sun Microsystem. Plus tard, Microsoft développera son propre langage Javascript: JScript. Tout comme, le language HTML, le Javascript est standardisé par un comité spécialisé, en l'occurrence l'ECMA (European Computer Manufactures Association).ECMA

4 W.GARALI4 Javascript (Présentation) La balise Association d'une procédure à un événement: –l'usage de la balise script n'est pas toujours obligatoire. Cest le cas des événements Javascript (par exemple onClick) où il faut simplement insérer le code à l'intérieur de la commande Html comme un attribut de celle-ci. L'événement fera appel à la fonction Javascript lorsque la commande Html sera activée. –Exemple:

5 W.GARALI5 Javascript (Présentation) Liste non exhaustive des évenements –onclick Clic souris (équivaut à onmousedown + onmouseup). –ondblclick Double clic souris. –onmousedown Bouton souris enfoncé. –onmouseup Bouton souris relaché. –onmouseover Objet survolé par souris. –onmouseout Fin de survol objet par souris. –onmousemove Déplacement souris. –onkeydown Touche du clavier enfoncée. –onkeyup Touche du clavier relachée. –onload Document ouvert et entièrement chargé. –onunload Document en instance de fermeture.

6 W.GARALI6 Javascript (Présentation) Où inclure le code dans la page HTML? Pas de place spécifique. Le navigateur traite la page HTML de haut en bas, par conséquent toute instruction ne pourra être exécutée que si le navigateur possède à ce moment précis tous les éléments nécessaires à son exécution. Prendre l'habitude de déclarer systématiquement (lorsque cela sera possible) un maximum d'éléments dans les balises d'en-tête

7 W.GARALI7 Javascript (Présentation) Extension.js pour scripts externes Les scripts sont stockés dans des fichiers distincts (avec l'extension.js) et ils sont appelés à partir d'un fichier HTML. Les instructions sont écrites telle quelles, la balise SCRIPT nest pas autorisée dans le fichier source

8 W.GARALI8 Javascript (Présentation) Première instruction Javascript –Utilisation de alert("votre texte"); –Cette instruction affiche le message « votre texte » dans une boite de dialogue pourvue d'un bouton OK. Pour continuer dans la page, le lecteur devra cliquer ce bouton. alert ("MessageBox");

9 W.GARALI9 Javascript (Présentation) Remarques: –Les points-virgules à la fin de chaque instruction Javascript: obligatoire que si on a plusieurs instruction sur une ligne. Recommandés. –Javascript est case sensitive. Ainsi il faudra écrire alert() et non Alert(). –Les caractères accentués comme é ou à ne peuvent être employés que dans les chaînes de caractères c.-à-d. dans votre texte de notre exemple. –Guillemets " ou l'apostrophe ' sont interprétés par le compilateur à condition de ne pas les mélanger. Ainsi alert("...') cause une erreur. Pour utiliser des guillemets dans vos chaînes de caractères, tapez \" ou \' pour les différencier vis à vis du compilateur.

10 W.GARALI10 Javascript (Structure)

11 W.GARALI11 Javascript (Structure) Nommage des objets –Si les objets ont été pourvu d un nom (attribut name) ils peuvent être nommés directement par ce nom document.MonFormulaire.BoutonEnvoi –Dans le cas inverse il peuvent être nommés par le nom générique indicé document.form[2].button[4]

12 W.GARALI12 Javascript (Structure) Propriété des objets –Une propriété est un attribut, une caractéristique, une description de l'objet window.document.bgColor ="blue"

13 W.GARALI13 Javascript (Structure) Méthode –A chaque objet est associé un ensemble de méthodes (ou fonctions dédiées à cet objet) qui lui sont propres. window.document.write("Hello");

14 W.GARALI14 Javascript (Structure) Méthode de lobjet document –Afficher du texte: Pour appeler la méthode write() du document document.write(); Pour associer du texte (chaînes de caractères) et des variables, on utilise l'instruction write("Le résultat est " + resultat); On peut utiliser les balises HTML pour agrémenter ce texte: write(" Le résultat est " + resultat); ou write (" " + "Le résultat est " + " " + resultat)

15 W.GARALI15 Javascript (Structure) Les nombres décimaux doivent être séparés par un point (.) comme le montre ces exemples : var PI = ; var prix = 2.50; En ce qui concerne la casse, le langage Javascript y est extrêmement sensible –var START = "début"; –var Start = "un"; –var start = "Un"; –var start = 0;

16 W.GARALI16 Javascript (Structure) Le langage Javascript reconnaît plusieurs types de valeurs : –Les nombres entiers ou à virgule flottante comme "42" ou " ". –Les valeurs logiques (Booléen), true (vrai) et false (faux). –Les caractères comme 'a', '5' '.', etc.. –Les chaînes de caractères comme "Bonjour !". –Null, un mot-clé spécial symbolisant une valeur nulle; le null est aussi une valeur primitive. Parce que JavaScript est sensible à la casse, null n'est pas le même comme le Null, le NULL, ou une autre variante.

17 W.GARALI17 Javascript (Variables) Dans le langage Javascript, les variables peuvent être globales ou locales. –Une variable globale est déclarée en début de script et est accessible à n'importe quel endroit du programme. –Une variable locale est déclarée à l'intérieur d'une fonction et n'est utilisable que dans la fonction elle-même. var int = 0 //Variable globale. function nomFonction () { var i = 1; //Variable locale.... }

18 W.GARALI18 Javascript (Variables) Le mot-clé var permet de déclarer une ou plusieurs variables. Après la déclaration de la variable, il est possible de lui affecter une valeur par l'intermédiaire du signe d'égalité (=). –// Déclaration de i, de j et de k. var i, j, k; –//Déclaration et affectation de caractere var caractere = ["a", "b", "c"];

19 W.GARALI19 Javascript (Variables) variable.big(); –Les quatre instructions Javascript suivantes sont équivalentes : str="Something"; //str est une variable document.write(" "+str+" "); document.write(' Something '); document.write(str.big()); document.write("Something".big()); variable.small(); variable.blink(); variable.bold(); variable.italics();

20 W.GARALI20 Javascript (Variables) variable.fontcolor(color); –L'emploi de.fontcolor(color) affichera la variable comme si elle était comprise entre les balises HTML. –Les quatre instructions Javascript suivantes sont équivalentes : –str1="Some words"; str2="red"; –document.write(" " +str1+" "); –document.write(" "+"Something "); –document.write(str1.fontcolor(str2)); –document.write(str1.fontcolor("red"));

21 W.GARALI21 Travail demandé Dossier sur les fonctions prédéfinie en javascript (Windows., alert(), etc.) Appel de la fonction, arguments, retour Utilisation Imprimé écran du résultat (si possible) Exercices recommandés : exercices-javascript


Télécharger ppt "Technologies Web JavaScript PhD. Wajdi GARALI INSAT 2010 Cette présentation donnera probablement lieu à des discussions d'où ressortiront des propositions."

Présentations similaires


Annonces Google