Activité 1 : Est-ce qu’on peut créer une page Web qui permet de saisir deux ent

Activité 1 : Est-ce qu’on peut créer une page Web qui permet de saisir deux entiers a et b et d’afficher leur maximum dans une boite de dialogue ? Constatation : Les limites du langage HTML : • Absence des structures de contrôle algorithmiques (conditionnelles et itératives) • Un langage sans aucune logique de programmation procédurale (notion de sous programmes, variables, opérateurs prédéfinies…) • Absence de possibilités d’interfaçage avec les bases de données Les solutions proposées : La solution est d’utiliser les langages structurés : • Coté client : JavaScript, VbScript. • Coté serveur : ASP, PHP, Cold fusion. Partie III : Le langage JavaScript II- Le formalisme de base du JavaScript : Activité 2 : Activité 2 page 79. Structure d’une page Web contenant un code JavaScript : <HTML><HEAD><TITLE>…..</TITLE> <………………………………..…………> ……………..……………… <……………> </HEAD><BODY> <………………………………..…………> ……………..……………… <……………> </BODY></HTML> SCRIPT language="JavaScript" SCRIPT SCRIPT language="JavaScript" SCRIPT EMPLACEMENT POUR LA DECLARATION DES FONCTIONS EMPLACEMENT DU CODE JAVASCRIPT Remarques : • Le code javascript doit etre entre les balises <script language =javascript>…………</script> • Chaque instruction se par un « ; » • Le code javascript est sensible a la casse (il faut distinguer entre les lettres • Tout ce qui est écrit entre le // et la fin de la ligne, représente un et il sera ignoré lors de l’exécution (//commentaire) • Pour mettre des commentaires sur plusieurs lignes (/* commentaire sur plusieurs lignes*/) termine Majuscule et Minuscule commentaire III- Les objets javaScript : La hiérarchie des objets d’interface : Objet Fenêtre (window) Objet document Objet formulaire Objet bouton Objet bouton radio Objet zone de texte Objet Fenêtre (window) Objet document Objet formulaire Objet bouton radio Objet bouton Objet zone de texte Les propriétés des objets : Exemple : pour accéder au contenu d’une zone de texte il faut utiliser la propriété value Syntaxe : x=Window.Document.form1.nom.value ; Les méthodes des objets : Exemples : La méthode write() : c’est une méthode applicable sur l’objet document Syntaxe : Window.Document .write("BienVenue") ; La méthode alert() : c’est une méthode applicable sur l’objet window Syntaxe : Window.alert("BienVenue") ; IV- Les Entrées / Sorties en JavaScript : 1) Les instructions d’affichage de JavaScript : Activité 3 : Créer un fichier HTML nommé « Act3.html » contenant le code JavaScript permettant l’affichage d’une fenêtre de message contenant le texte suivant : « Bonne année 2012 », sachant que 2012est stocké dans une variable Y. La méthode alert () : C’est une méthode de l’objet window permet l’affichage dans une fenêtre de message (boite de dialogue). Exemple : Méthode Aperçu y=2012 window.alert("Bonne année"+y) ; Activité 4: Activité 3 page 82 La méthode write () :C’est une méthode de l’objet document permet de modifier de façon dynamique le contenu d’une page web. 2) Les instructions de saisie dans JavaScript : Activité 5 : Activité 6 page 86. SYNTAXE Nom_variable = prompt("message",valeur par défaut(initialisation)); Conversion de types : La fonction isNaN() : is Not a Number : est une fonction booléenne permettant de vérifier si le contenu d’une variable est numérique ou non : isNaN(A) : retourne True si le contenu de A n’est pas numérique. isNaN(A) : retourne False si le contenu de A est numérique. Ex : A= prompt("Donner votre numéro d’ordre dans la classe"," ") ; If(isNaN(A)){ alert (" Conversion impossible ");} else { B=Number (A); B=B+1 ;} La fonction Number() : permet de convertir une chaîne en entier s’il est possible. Ex1 : A= prompt ("Saisir votre année de naissance","19 ") ; A=A+1 ; alert(A) ; Résultat=…………………. 191 Ex2: A= Number(prompt("Saisir votre année de naissance","19 ")) ; A=A+1 ; alert (A) ; Résultat=…………………. 20 La fonction String() : permet de convertir un entier en chaîne de caractères. Ex : A=200 ; B=String (A) ; B=B+1 ; alert (B) ; Résultat=…………………. 2001 V- Les structures de données dans JavaScript : Les variables : La déclaration d’une variable : Les variables peuvent se déclarer de deux façons : Façon Explicite : JavaScript utilise le mot clé var devant la variable à déclarer. Ex : var n=22 ; var chaine=" Bonjour" ; var b=2>5 ; Façon Implicite : On écrit directement le nom de la variable suivie du caractère = et de la valeur à affecter. Ex : n=22 ; chaine=" Bonjour" ; b=2>5 ; Les types d’objets dans JavaScript : Type Description Des nombres Tout nombre entier ou avec virgule tel que 22 ou 3.1416 Des chaînes de caractères Toutes suite de caractères comprise entre guillemets Des booléens Les mots true pour vrai et false pour faux Le mot null Mot spécial qui indique que la variable est vide 3) La portée (visibilité) des variables : La déclaration explicite d’un variable dans une fonction rend ce dernier visible seulement dans la fonction (variable…………..) et visible dans la totalité de la page dans les autres cas (variable ………..). local global Activité6 : Ecrire un programme en JavaScript qui permet la saisie de deux entiers « A » et « B » à partir de deux boites de dialogues puis afficher leurs sommes, la soustraction, le produit, la division réelle et le reste de la division entière. Les opérateurs prédéfinis Les opérateurs de calcul (x=11) Signe Signification Exemple Résultat + Addition x+3 14 - Soustraction X-1 10 * Multiplication X*2 22 / Division x/2 5.5 % Reste par la division de X%3 2 = Affectation X=5 5 Les opérateurs prédéfinis Les opérateurs de comparaison (x=11) Signe Signification Exemple Résultat == Egal X==11 True < Inférieur X<3 False <= Inférieur ou Egal X<=11 True >= Supérieur X>11 False > Supérieur ou Egal X>=11 True != Différent X!=11 False Les opérateurs prédéfinis Les opérateurs associatifs (x=11) Signe Signification Exemple Résultat += X+=4; <-> x=x+4; X+=4 15 -= X-=4; <-> x=x-4; X-=4; 7 *= X*=4; <-> x=x*4; X*=4; 44 /= X/=4; <-> x=x/4; X/=4; 2.75 Les opérateurs prédéfinis Les opérateurs Logiques Signe Signification Exemple Résultat && ET (x==5) && true false || OU (x==5) || true true ! NON ! (x>=11) false Les structures de contrôle conditionnelles : Activité 7 : Créer un fichier HTML contenant le code JavaScript permettant de déterminer le maximum entre deux entiers. Le résultat sous forme d’une fenêtre de message La forme réduite If (condition) {Traitement ;} Les structures de contrôle conditionnelles : Activité 8 : Créer un fichier HTML contenant le code JavaScript permettant de déterminer le maximum entre trois entiers. La forme complète If (condition) {Traitement1 ;} else {Traitement2 ;} La forme généralisée If (condition) {Traitement1 ;} else ……… else {Traitement n ;} Les structures de contrôle conditionnelles : La structure switch Switch (expression) { case valeur1:Traitement 1; break; case valeur2:Traitement 2; break; case valeur3:Traitement 3;break; default: Traitement 4 ; break; } Exemple: <script language =javascript > a=Number(prompt("saisir un a","")); switch (a) { case 1:alert("Dimanche");break; case 2:alert("Lundi");break; case 3:alert("Mardi");break; case 4: alert("Mercredi");break; case 5: alert("Jeudi"); break; case 6: alert("Vendredi"); break; case 7: alert("Samedi"); break; default : alert("Erreur") ; break; } </script> 3) Remarques : L’instruction break permet de quitter la structure switch après l’exécution du bloc convenable Le traitement de default est un traitement facultatif exécuté dans le cas où l’expression ne satisfait pas l’ensemble des cas indiqués. Les structures de contrôle conditionnelles : Les structures de contrôle itératives : La boucle Pour : (La structure for) : Activité 10 : Ecrire un script qui permet de saisir deux entiers a et b et de calculer a * b sans utiliser l’opérateur « * ». Syntaxe for (Valeur initiale ; Condition ; progression) { Traitement à répéter } Exemple Afficher le message Bonjour 5 fois : for ( i=1 ; i<=5 ; i++) {document.write(« Bonjour"); } Les structures de contrôle itératives : La boucle Répéter : (La structure do…while) : Activité 10: Créer un fichier HTML contenant le code JavaScript permettant la lecture de deux entiers avec (a>b). Syntaxe do {Traitement à répéter } while( condition(s)) ; Exemple Exemple : Lire un entier a tels que a>0 : do { a = prompt("Donner le premier entier : "," "); a = Number(a) ; } while (a<=0); Autrement do { a = prompt("Donner le premier entier : "," "); a = Number(a) ; } while (!(a>0)); Les structures de contrôle itératives : La boucle Tantque : (La structure while) : Activité 11 : : Créer un fichier HTML contenant le code JavaScript permettant de calculer le PGCD de deux entiers a et b, tels que a>1 et b >2, en utilisant la méthode des différences. Syntaxe while( condition(s)) {Traitement à répéter ;} Exemple Exemple : PGCD de deux entiers par la méthode de différence. while( a !=b) { if (a>b) {a - = b;} else { b - = a; } } Les fonctions en JavaScript Activité 12 : Créer un fichier HTML contenant un code JavaScript permettant d’afficher le maximum entre deux entiers tout en utilisant une fonction. Activité 13 : Créer un fichier HTML contenant un code JavaScript permettant d’afficher le mot "Bonjour". NB : Déclarer une fonction affiche non paramétrée. Syntaxe <HEAD> ………….. <script language =javascript > function nom_fonction (paramètre(s)) { Traitement(s) ; Return nom_variable ;} uploads/s1/ cours 19 .pdf

  • 40
  • 0
  • 0
Afficher les détails des licences
Licence et utilisation
Gratuit pour un usage personnel Attribution requise
Partager
  • Détails
  • Publié le Oct 26, 2021
  • Catégorie Administration
  • Langue French
  • Taille du fichier 2.8527MB