[PDF] FASCICULE DES TRAVAUX PRATIQUES - WordPresscom

JavaScript - Travaux Pratiques 1 - univ-artoisfr

JavaScript - Travaux Pratiques 1 Pour JavaScript, il est fortement conseill e d’utiliser emacs sous Linux pour cr eer vos chiers Chaque chier doit avoir l’extension js Pour associer du code JavaScript plac e dans un chier externe a une page HTML, il su t d’utiliser l’attribut type avec l’attribut src dans un el ement script

TP 2 JavaScript - Toubkal-it

TP JavaScript Sujet Un restaurant vous demande de réaliser un formulaire pour qu'un client puisse commander son repas à la carte par internet Vous calculerez au fur et à mesure le tarif qui sera affiché dans un champ du formulaire et remis à jour lorsqu'un plat sera sélectionné Si le tarif dépasse une certaine

FASCICULE DES TRAVAUX PRATIQUES - WordPresscom

Le TP n°4 sera consacré aux événements JS et l’utilisation des formulaires Par la suite, on a un TP n°5 qui étudie le DOM et sa syntaxe de base en JavaScript Les 2 derniers TP seront consacrés au langage XML et sa validation avec DTD A la fin de chaque TP, l’étudiant devra préparer un compte rendu à remettre après avoir le

TP DOM - richard-ostrowskieu

TP DOM Exercice 1 : menu généré automatiquement Ecrire une fonction javascript qui construit dynamiquement un menu (sous la forme d’une liste de liens) dans une balise à partir des éléments de type h1 présents dans le document courant Il faudra positionner correctement les ancres afin de naviguer dans le

Programmation Web TP no 3 : Javascript et jQuery

TP no 3 : Javascript et jQuery Le but de ce TP est d’apprendre le langage Javascript et sa librairie JQuery Les exercices proposent de l’utiliser cot e client pour dynamiser des pages Web Pour debugger vos programmes, vous aurez besoin d’utiliser la console javascript On y acc ede par le menu des outils de d eveloppement

TP TIC (J S) - Kitebnet

TP N°4 (Introduction au J S): Objectifs : Savoir insérer du code JS dans une page Web Savoir accéder aux objets formant une page Web en écrivant de code JS I- Qu’est ce que le Javascript : Javascript est un langage de scripts qui incorporé aux balises Html, permet d'améliorer la présentation et l'interactivité des pages Web

LAPI DOM et son implémentation en JavaScript

L'API DOM implémentée en JavaScript permet de manipuler un document HTML ou XHTML, afin d'en modifier dynamiquement (en fonction des actions utilisateurs), la structure et le contenu : Faire apparaître ou disparaître des éléments div en fonction d'une action utilisateur

Exercises related to HTML, CSS, and JavaScript

need two new JavaScript functions for these buttons The functions should modify the "width" attribute of the element to change the picture sizes (The height of the

PHP5 cours et exercices - Training Brussels

Jean Engels Avec la contribution de Olivier Salvatori PHP5 Cours et exercices 2e édition - PHP 5 2 et 5 3 engels titre 6/04/09 9:25 Page 1 Jean Engels Avec la contribution de Olivier Salvatori

web avec Javascript Dynamisez vos sites

La portée des variables 54

[PDF] le maroc et les droits de l homme

[PDF] droit humain maroc

[PDF] examen javascript corrigé

[PDF] exercice interactif javascript

[PDF] cours javascript complet pdf

[PDF] conjoncture économique mondiale 2016

[PDF] economie mondiale classement

[PDF] economie mondiale pdf

[PDF] l'économie mondiale 2017 pdf

[PDF] economie mondiale 2017 classement

[PDF] économie mondiale actuelle

[PDF] perspectives économiques mondiales 2017

[PDF] projet jazz cycle 2

[PDF] situation initiale élément perturbateur situation finale

[PDF] fiche jazz cp

Ministğre de l'Enseignement SupĠrieur de la Recherche

Scientifique

Direction Générale des Etudes Technologiques

FASCICULE DES TRAVAUX

PRATIQUNS

Atelier MéveloppemenW Peb eW

ÓulWiméTia II

AU J 2015-2016

Natija BOUZIDI

Assistante technologue à ISET Sidi Bouzid

Avant Propos

Ce faVcicule Te Wravaux praWiqueV inWiWulé " AWelier MéveloppemenW Peb eW ÓulWiméTia II première année en Licence AppliquéV en TecUnologieV Te Le faVcicule comporWe 7 TPH qui VonW reparWieV comme VuiW J TP n°1 J RéviVion Vur HTÓL eW CSS (NWuTié en LATIS1 J AWelier MéveloppemenW Peb eW ÓulWiméTia I) TP n°2 J SynWaxeV Te baVe Tu langage JavaScripW

TP n°3 J ObjeWV préTéfiniV Tu JS

TP n°4 J NvénemenWV eW ŃormulaireV Tu JS

TP n°5 J Le MOÓ en JavaScripW

TP n°6 J Langage XÓL

TP n°7 J La valiTaWion XÓL avec MTM

du Peb 2 éWuTiéV TanV le courV " ProgrammaWion Peb 2 ». TP n°1 une réviVion Vur leV langageV Tu Peb 1 éWuTié en première VemeVWre (LATIS1). ManV un 2éme TP appliquai la VynWaxe Te baVe Tu JS par exemple leV variableVH leV VWrucWureV Te conWrôleVH leV foncWionV uWiliVaWeurV eWc. PuiV TanV le TP étudiai leV TifférenWV objeWV préTéfiniV Tu JS.

Le TP n°4 Vera conVacré aux événeme

Par la VuiWeH on a un TP n°5 qui éWuTie le MOÓ eW Va VynWaxe Te baVe en JavaScripW. LeV 2 TernierV TP VeronW conVacréV au langage XÓL eW Va valiTaWion avec MTM. compte rendu à remettre après avoir le réTiger VoigneuVemenW. notre miVVion.

L'auteur

Fiche matière

PRE REQUIS

ProgrammaWion web1H algoriWUmique eW VWrucWure Te TonnéeV 1 eW AWelier MéveloppemenW

Peb eW ÓulWiméTia I

OBJECTIFS GENERAUX

Se rappeler Tu Peb 1 (HTÓL eW CSS)

Appliquer eW comprenTre lGenVemble TeV concepWV Te baVe Tu langage côWé clienW J

JavaScripW.

PraWiquer leV objeWV eW leV événemenWV Tu JS.

Appliquer le MOÓ en JavaScripW

ApprenTre à créer un TocumenW XÓL eW un TocumenW en MTM

POPULATION

Profil J Licence

Niveau J L1(S2)

DEROULEMENT

Volume Uoraire J 3U aWelier IVemaine

Murée J 15 VemaineV

EVALUATION

CompWe renTu

Nxamen TP

MOYEN PEDAGOGIQUE

ŃaVcicule Te Travaux PraWiqueV

Tableau

Table des matières

Atelier n°1 J RéviVion Peb 1 (HTÓL F CSS) .................................................................... 1

Nxercice n°1 J (miVe en forme) ............................................................................................................ 2

Nxercice n°2 J (Tableau) ....................................................................................................................... 3

Nxercice n°3 J (Tableau) ....................................................................................................................... 3

Nxercice n°4 J ....................................................................................................................................... 4

Nxercice n°5 J ....................................................................................................................................... 4

Nxercice n°6 J ....................................................................................................................................... 5

Nxercice n°7 J ....................................................................................................................................... 5

Nxercice n°8 J (leV caTreV) .................................................................................................................... 6

Nxercice n°9 J (Un formulaire compleW) ............................................................................................... 7

Nxercice n°10 J (cVV) ............................................................................................................................. 9

Atelier n°2 J IniWiaWion au JavaScripW ............................................................................. 11

Nxercice n°1 J ..................................................................................................................................... 12

Nxercice n°2 J ..................................................................................................................................... 12

Nxercice n°3 J ..................................................................................................................................... 12

Nxercice n°4J ...................................................................................................................................... 12

Nxercice n°5J ...................................................................................................................................... 12

Nxercice n°6J ...................................................................................................................................... 12

Nxercice n°7J ...................................................................................................................................... 13

Nxercice n°8J ...................................................................................................................................... 13

Nxercice n°9 J ..................................................................................................................................... 13

Nxercice n°10J .................................................................................................................................... 14

Atelier n°3: Les objets en JavaScript .......................................................................... 15

Nxercice n°1J ...................................................................................................................................... 16

Nxercice n°2 J ..................................................................................................................................... 16

Nxercice n°3 J ..................................................................................................................................... 16

Nxercice n°4 J ..................................................................................................................................... 16

Nxercice n°5 J ..................................................................................................................................... 16

Nxercice n°6 J ..................................................................................................................................... 17

Nxercice n°7 J ..................................................................................................................................... 17

Nxercice n°8J ...................................................................................................................................... 17

Nxercice n°9 J ..................................................................................................................................... 17

Exercice n°10: .................................................................................................................................... 18

Atelier n°4: Formulaires et événements en JavaScript ..................................... 19

Nxercice n°1 J ..................................................................................................................................... 20

Nxercice n°2 J ..................................................................................................................................... 20

Nxercice n°3 J ..................................................................... 20

Nxercice n°4J CUoiVir Von menu ......................................................................................................... 21

Nxercice n°5J Récupérer la valeur saisie ............................................................................................ 21

Nxercice n°6J Le nombre secret .......................................................................................................... 22

Nxercice n°7J TexWe à WrouV ................................................................................................................ 23

Nxercice n°8J ...................................................................................................................................... 24

Nxercice n°9J ...................................................................................................................................... 25

Nxercice n°10J .................................................................................................................................... 27

Atelier n°5: Les DOM en JavaScript ............................................................................... 31

Nxercice n°2 ͗ Modifier l'arborescence .............................................................................................. 32

Nxercice n°4 J ..................................................................................................................................... 33

Nxercice n°5 J ..................................................................................................................................... 34

Nxercice n°6 J ..................................................................................................................................... 34

Atelier n°6: Langage XML ..................................................................................................... 35

Nxercice n°1 J ..................................................................................................................................... 36

Nxercice n°2 J ..................................................................................................................................... 36

Nxercice n°3 J Utilisation des attributs ............................................................................................... 36

Nxercice n°4 J ..................................................................................................................................... 37

Nxercice n°5 J ..................................................................................................................................... 37

Atelier n°7: XÓL eW MTM ......................................................................................................... 39

Edžercice Σ1͗ CrĠation d'une DTD ........................................................................................................ 40

Nxercice n°2 J uWiliVaWion TGune MTM .................................................................................................. 40

Nxercice n°3 J ..................................................................................................................................... 40

Nxercice n°4 J créaWion TGune MTM ..................................................................................................... 41

Nxercice n°5 J ..................................................................................................................................... 41

Bibliographies ...................................................................................................................................... 42

Atelier n°1 J RéviVion Peb 1 (HTÓL F

CSS)

Objectifs

A la fin Te ce TPH leV éWuTianWV auronW leV connaiVVanceV néceVVaireV pour J

™ La miVe en forme Tu WexWe eW Tu page HTÓL

™ InVerWion eW formaWage TeV Tableaux TanV un page Peb

™ UWiliVaWion TeV puceV.

™ InVerWion TeV lienV UyperWexWe TanV un page Peb ™ UWiliVaWion TeV frameV eW TeV formulaireV TanV un page web

Volume horaire

6 UeureV

Exercice n°1 J (miVe en forme)

1. écrire leV coTeV en UWml correVponTanW aux exempleV VuivanWV J

texte en gras texte en italique

WexWe Vouligné

texte biffé texte en police à chasse fixe

WexWe clignoWanW

texte en gras texte en italique

2. Centrage dans la page (3 méthodes) J WexWe ou objeWV

3. Justification à droite (2 méthodes) : WexWe ou objeWV

4. Indices et expoVanWV J inTice , exposant

5. Taille et couleur du texte :

WexWe...

6. Police et/ou famille de caractère :

WexWe... OuWre leV polices, on peut spécifier les familles Te policeV VuivanWeV J serif, sans-Verif, monospace, cursive, fantasy

7. Pour changer globalement la WailleH la couleur eW la police TanV WouWe une pageH uWiliVer

leV VWyleV CSS1H ou placer la baliVe VuivanWe TanV le bloc ...: (aWWribuWV COLOR eW FACE inWerpréWéV par IN VeulemenW)

8. Réalisez en HTML le système d'équations suivant :

X2 = X1 cos(ɲ н ɴ) - Y1 sin(ɲ н ɴ)

Y2 = X1 Vin() + Y1 coV()

9. Réaliser en UWml leV liVWeV VuivanWeV

¾ Combinaison de listes numérotée et à puce :

1. Ecole primaire :

1ère : Yverdon

2e-3e J NcUallenV

2. Ecole secondaire :

o 1ère-3e J NcUallenV

¾ Liste à puce :

Adresse : EPFL, CH-1015 LauVanne

Tél : +41 (0)21 693 27 73

Fax : +41 (0)21 693 27 27

E-mail J JuleV.Mucommun@epfl.cU

Exercice n°2 J (Tableau)

Réalisez le tableau repréVenWé -TeVVouV.

Exercice n°3 J (Tableau)

Créer un document HTML conWenanW le Wableau VuivanW. VouV uWiliVereY TanV ce Wableau leV aWWribuWV wiTWUH cellpaTingH cellVpacing eW borTer afin Te le renTre pluV préVenWable.

Exercice n°4 J

Créer un document HTML contenant les éléments suivants J

Exercice n°5 J

Ecrire le coTe UWml qui correVponT à ceWWe figure J

Exercice n°6 :

1. Créer une VWrucWure Te réperWoireV en arbre à Teux brancUeV J

2. Créer TanV cUacune TeV 5 pageVH une liVWe non orTonnée Te lienV relaWifV verV cUacune TeV

auWreV pageV.

3. AjouWer Tu WexWe à la page index.htm

pour voir tout le contenu de la page.

4. AjouWer un lien inWerne appelé haut

début de la page.

5. AjouWer un lien inWerne appelé baV

de la page.

Exercice n°7 J

1. Réalisez une page HTML qui aura cette apparence :

2. Reproduisez une page qui présente la structure ci-TeVVouV J

3. Enregistrez ce fichier et viVualiVeY-le TanV voWre navigaWeur

Nxercice n°8 J (leV caTreV)

Nous allons créer un site pour le cours du langage C qui suit la description suivante : La page principale (inTex.UWm) conWienW Teux caTreV ƒ Le cadre à gauche contient la liste des chapitres. ƒ Le cadre à droite contient le contenu de chaque chapitre. ƒ On clique sur le nom du chapitre (lien qui se trouve dans le cadre à gauche)

1. Ncrire le coTe HTÓL correVponTanW WouW en créanW leV pageV néceVVaireV.

2. AjouWer un WroiVième caTre en UauW qui afficUe le WiWre Tu courV "CourV langage C».

Exercice n°9 J (Un formulaire compleW)

Créer un document html considéré comme un petit site web eW conWenanW leV pageV VuivanWeV J

1. Une page index.html (page index.html contenant découpage de la page web, page

2. Appel de la page accueil.html

3. Appel de la page presentation.UWml

4. Une page inscription.html

5. Appel de la page coordonnee.html

- UWiliVer un Wableau VanV borTure pour mieux aligner leV TifférenWV élémenWV Te ce formulaire

Nxercice n°10 J (cVV)

Réalisez la page Web représentée par l'image ci-TeVVouV J ¾ d'abord en définissant un "embedded style sheet" ¾ puis en définissant un "external" stylesheet

Atelier n°2 J IniWiaWion au JavaScripW

Objectifs

A la fin Te ce TPH leV éWuTianWV auronW leV connaiVVanceV néceVVaireV pour J ™ UWiliVer un coTe JavaScripW TanV un coTe HTÓL

JavaScripW.

™ UWiliVer leV boucleV eW leV VWrucWureV Te conWrôleV TanV un coTe JavaScripW. ™ CréaWion eW appel TeV foncWionV TanV un coTe JavaScripW.

Volume horaire

6 UeureV

Exercice n°1 J

fficher " Bonjour ISET Sidi

Exercice n°2 J

Exercice n°3 J

Créer un document HTML conWenanW un coTe JavaScripW qui afficUe VimplemenW 10 ligneV conWenanW le moW " ligne » Vuivi Tu numéro Te ligne

Exercice n°4J

9 Ecrire une foncWion qui afficUe la Vomme TeV enWierV compriV enWre leV enWierV T eW f. LeV

9 Ecrire une fonction qui affiche la somme des entiers pairs compris entre les entiers

relaWifV T eW f. LeV val

Exercice n°5J

Ecrire une fonction nommée C2H MS)H qui

calcule eW afficUe la moyenne obWenue.

Exercice n°6J

Ecrire une fonction qui détermine la moyenne TGun enVemble Te noWeV VanV Vavoir au

TéparW combien il y aura Te noWeV enWréeV. Le WeVW TGarrêW peuW êWre lGenWrée TGun nombre négaWif.

Ligne num 1

Ligne num 2

Ligne num 3

Ligne num 10

Exercice n°7J

Utilisez la boucle for() pour afficUer la figure ci-TeVVouV J

Exercice n°8J

Ecrire une page HTML faisant apparaitre la table de multiplication pour les entiers compriV enWre 0 eW 10 eW préVenWer le réVulWaW TanV un Wableau [11 x 11].

Exercice n°9 J

1. développer une fonction en JavaScript qui permeW Te J

a. Saisir les notes de N étudiants, sans savoir au départ combien il test d'arrêt peut être l'entrée d'un nombre négatif. b. Calculer la moyenne de la classe. 1 11 111
1111
11111

111111

1111111

11111111

111111111

1111111111

c.

2. Dans la même structure écrite, précédemment, trouver la meilleure noWe eW la pire noWe.

3. Afficher la moyenne, le pourcenWageH la meilleure noWe eW la pire noWeH

Exercice n°10J

Écrire un script js qui affiche une boîte de dialogue de saisie avec le message suivant : " Entrez

une année J ".

Il vouV fauW WeVWer Vi

devez écrire une fonction isAnneeBissextile() qui : 9 9 année bissextile".

Remarque :

zone de saisie et retourne les données saisies pa

Atelier n°3J LeV objeWV en JavaScripW

Objectifs

A la fin Te ce TPH leV éWuTianWV auronW leV connaiVVanceV néceVVaireV pour J ™ UWiliVer leV objeWV préTéfiniV en JavaScripW ™ Appliquer leV objeWV préTéfiniV Te JavaScripW Vur TeV exempleV

Volume horaire

6 UeureV

Exercice n°1J

Ecrire en JavaScript un programme qui reWournera la racine quaWrième Te la valeur paVVée en argumenW

Exercice n°2 J

une équaWion Tu VeconT Tegré Te la forme ax2 + bx + c =0

Ncrire une page Peb permeWWanW Te J

1. (a, b et c).

2.

Remarque J

Delta = b2 4ac

Si Delta = 0 H la VoluWion X0 = െ࢈

Exercice n°3 J

Ecrire une page HTML dont le code JavaScript, saisit une chaîne correspondante à un

PrénomH puiV afficUe ce prénomH en majuVculeH ainVi que Va longueur (uWiliVer la propriéWé

lengWU).

Exercice n°4 J

Ecrire en JavaScript la foncWion nbÓoWV(WxW) qui compWe le nombre Te moWV Tu WexWe Tonné InTicaWionV J La foncWion VpliW(...) peuW évenWuellemenW vouV aiTer

Exercice n°5 J

Ecrire en JavaScript une foncWion permeWWanW la recUercUe TanV une cUaîne expr WouWeV leV occurrenceV TGune VouV-cUaîne a eW leV remplace par une VouV-cUaîne b.

Exercice n°6 J

1. Ecrire une foncWion facW qui calcule eW reWourne la facWorielle TGun enWier poViWif n.

2. Écrire une fonction carre qui prenT en argumenW un Wableau Wab eW qui meW WouV leV

élémenWV Tu Wableau au carré. Par exemple J le réVulWaW Te lGapplicaWion Te carre au

Wableau [1H2H3H4] Tonnera [1H4H9H16].

Remarque J LorVque voWre conVole TevienW Wrop cUargée en afficUageVH vouV pouveY effacer Von conWenu en cliquanW Vur "ViTer la conVole".

3. Écrire une fonction applique qui prenT en argumenW un Wableau Wab eW une foncWion f eW

qui applique la foncWion f à WouV leV élémenWV Tu Wableau.

4. Utiliser la fonction applique pour meWWre au carré WouV leV élémenWV TGun Wableau comme

TanV la parWie précéTenWe.

Exercice n°7 J

1. Ecrire une foncWion qui permeW Te WeVWer Vi une cUaîne Te caracWère paVVée en paramèWre

commence par une leWWre majuVcule ou minuVcule enWre GaG eW GTG. 2. renvoie 'false'.

3. Ecrir

renvoie 'false'.

4. Ecrire une fonction qui remplace les chiffre par le caractère '*' .

5. Créer un script qui va utiliser ces fonctions

Exercice n°8:

Ecrire une page HTML une

TaWe "15I03I2010" puiV afficUe TanV la page web le jourH le moi:

Jour = 15

ÓoiV = 03

Année = 2010

Exercice n°9 J

Ecrire une fonction JavaScript qui permet de cUarger 5 imageV eW Te leV afficUer TanV 5 baliVeV KimgL TifférenWeV grâce au Wableau imageV[].

Exercice n°10:

change. On a au total 4 images différentes. On utilise un

, une balise , et une fonction. Lorsque les 4 images ont défilé, on recommence à

la première. Pour celaH on uWiliVe un compWeur. Atelier n°4J ŃormulaireV eW événemenWV en

JavaScripW

Objectifs

A la fin Te ce TPH leV éWuTianWV auronW leV connaiVVanceV néceVVaireV pour J

™ UWiliVer leV formulaireV en JavaScripW

™ Gérer leV propriéWéV TeV cUampV TeV formulaireV ™ Nxprimer TeV expreVVionV régulièreV pour valiTer TeV cUaineV VaiVieV. ™ Appliquer leV événemenWV Te JavaScripW Vur leV formulaireV.

Volume horaire

6 UeureV

Exercice n°1 J

On veut écrire un petit programme JavaScript permettant de calculer un produit Vomme. LGuWiliVaWeur VaiVira leV valeurV à ajouWer TanV Teux cUampV J

Exercice n°2 J

Soit le formulaire suivant J

Ecrire une fonction JavaScript qui cherche dans une chaîne ch la Ternière occurrence

TGune VouV-cUaîne a et la remplace par une sous-cUaîne b. (Utilisez les formulaires pour saisir

la cUaine iniWiale eW leV VouV-

Exercice n°3 J

1. Créer le document à partir Tu coTe Vource fourni ci-TeVVouV.

KHTÓLL

KHNAML

KTITLNLNxercice 3 JavaScripWKITITLNL

KIHNAML

KPLJe VuiV un TocumenW HTÓL.KIPL

KIHTÓLL

2. Tester dans un

navigaWeur.quotesdbs_dbs45.pdfusesText_45