Kamertic - Intégration des TICs dans l'Enseignement

Kamertic - Intégration des TICs dans l'Enseignement

Leçon 1 : Concepts fondamentaux et Structure d’un programme JavaScript

CHAPITRE 1 : PROGRAMMATION EN JAVASCRIPT

                Leçon 1 : Concepts fondamentaux et Structure d’un programme JavaScript

 

 

Image2.png Image3.png

 

 

 

 

 

 

 

 

 

 

Introduction

      En classe de première, les notions de langage HTML ont été abordées  pour  la  création  de  pages Web  statiques.  Le  savoir-faire, qui  était  limité  en  la  production d'un document figé, un peu comme  une  photo,  est  bien  loin de  pouvoir  créer  des  pages  semblables  à  celles  présentes  sur  le Web. Une première solution sera abordée dans ce module à travers le langage JavaScript.

 

     I.  Quelques rappels et définitions

 

      Le HTML (HyperText Markup Language) est un langage permettant de créer les pages web statiques. Une page web étant un document contenant du texte, des images, des vidéos, des tableaux, des diagrammes ou graphiques accessibles à partir d’un navigateur. Le navigateur interprète les instructions contenues dans le document HTML. Ces instructions (balises) sont des mots prédéfinis encadrés par les chevrons < et>. Elles fonctionnent le plus souvent en paire

  • balise ouvrante (exemple <HTML>)
  • balise fermante (exemple </HTML>)

Les balises sont souvent enrichies par des attributs qui ont pour but de donner des informations supplémentaires sur la manière dont la balise doit être interprétée. Un attribut est composé de son nom suivi du signe « = » et de sa valeur entre guillemets. Attribut= ‘’valeur ‘’. Afin de rendre les pages web statiques nous allons introduire la notion de JavaScript.

      Le JavaScript est une couche de programmation supplémentaire qui vient s’ajouter au langage HTML (langage de base des pages web) dans le but de le rendre interactive les pages les pages web. Le JavaScript a été créé par la société NETSCAPE en 1995, à l’origine il se nommait LIVESCRIPT. Les éditeurs html (bloc note, simpletext) sont aussi utilisés en JavaScript, mais il yen existe d’autres, WYS/WYG (what you see is what you get) capable de générer automatiquement des codes JavaScript. Exemple : JavaScript Editor, Web Expert.

 

NB : le JavaScript  s’exécute coté client

 

II. Importance et limites du JavaScript

 

1.    Importance

     En  classe  de  première,  les  pages  Web  que  nous  avons  conçues étaient statiques, c’est-à-dire que leur contenu n’était pas modifiable, et ne réagissaient pas aux actions de l’utilisateur sauf pour ce qui est des clics sur les liens hypertextes. JavaScript va ajouter de l’interactivité. On va pouvoir :

  • Répondre  à  des  actions  de  l’utilisateur  (clic  sur  un  lien  ou sur un bouton, survol d’une image avec la souris, etc) ;
  • Récupérer des valeurs entrées par l’utilisateur pour exécuter des commandes (exemple de la validation d’un formulaire, calculs simples sur les valeurs entrées, gestion des dates et des heures) ;
  • Créer et de lire des cookies ;         
  • Gérer la navigation (menu dynamique) ;
  • Réaliser des animations graphiques ;
  • Lire et écrire des éléments HTML.

 2.    Limites

JavaScript reste limité pour les raisons ci-après :

 

  • JavaScript  est  très  dépendant  du  navigateur  (l’exécution d’un  script  JavaScript  peut  donner  des  résultats  différents d’un  navigateur  à  un  autre)  et  un  certain  nombre  (comme Lynx ou Internet Explorer) le supportent mal ;
  • JavaScript ne permet pas d’écrire ou de lire le disque dur. Il n’est donc pas possible de créer des pages Web dynamiques (pages créées en fonction des besoins de l’utilisateur ou des entrées d’une base de données), de concevoir un forum de discussion, un script de sondage ou de vote. Pour cela, on va utiliser des langages de script comme PHP, CGI ou ASP ;
  • JavaScript n’échange pas avec d’autres machines connectées.

Impossible  donc  de  créer  une  page  de  chat  (discussion  en direct).

 

III. Structure d’un programme JavaScript

 

Pour insérer un code JavaScript dans un code html on utilise la balise <script>…. </script>

Syntaxe : <script language="JavaScript"> /* code javascript */</script>

 Exemple : <script language="JavaScript"> function saluer (){alert(’’Bonjour’’) ;}</script>

 Le code JavaScript peut être placé aussi bien dans l’entête (head) que dans le corps (body) de la page html. Dans tous les cas il est annoncé par la même balise

Lorsque le code se situe dans l’entête il est placé entre les balises<head> et </head>. Une page html peut avoir plusieurs scripts javascript.

Exemple :

 <HTML>

     <HEAD>

       </TITLE>Bienvenue en terminale<TITLE>

 <script language="javascript"> /* code javascript */</script>

   </HEAD>

  </BODY>

 <script language="javascript"> /* code javascript */</script>

</BODY>

<HTML>

Conclusion

concluez vous même ....

 

Elaboré par  Cyrille JIBA, PLEG info, Lycée bilingue de DEIDO, Douala



17/09/2015
0 Poster un commentaire

A découvrir aussi


Ces blogs de Enseignement & Emploi pourraient vous intéresser

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 13 autres membres