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
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
Inscrivez-vous au site
Soyez prévenu par email des prochaines mises à jour
Rejoignez les 30 autres membres