JavaScript

2e édition

Chris Minnick et Eva Holland

JavaScript pour les Nuls, 2e édition

Titre de l’édition originale : Coding with JavaScript for Dummies

Copyright © 2015 Wiley Publishing, Inc.

Pour les Nuls est une marque déposée de Wiley Publishing, Inc.

For Dummies est une marque déposée de Wiley Publishing, Inc.

Édition française publiée an accord avec Wiley Publishing, Inc.

© Éditions First, un département d’Édi8

12, avenue d’Italie

75013 Paris – France

Tél. : 01 44 16 09 00

Fax : 01 44 16 09 01

Courriel : firstinfo@editionsfirst.fr

Site Internet : www.pourlesnuls.fr

ISBN : 978-2-412-02888-9

ISBN numérique : 9782412032916

Dépôt légal : août 2017

Mise en page : Pierre Brandeis

Tous droits réservés. Toute reproduction, même partielle, du contenu, de la couverture ou des icônes, par quelque procédé que ce soit (électronique, photocopie, bande magnétique ou autre) est interdite sans autorisation par écrit d’Édi8.

Cette œuvre est protégée par le droit d’auteur et strictement réservée à l’usage privé du client. Toute reproduction ou diffusion au profit de tiers, à titre gratuit ou onéreux, de tout ou partie de cette œuvre est strictement interdite et constitue une contrefaçon prévue par les articles L 335-2 et suivants du Code de la propriété intellectuelle. L’éditeur se réserve le droit de poursuivre toute atteinte à ses droits de propriété intellectuelle devant les juridictions civiles ou pénales.

Ce livre numérique a été converti initialement au format EPUB par Isako www.isako.com à partir de l'édition papier du même ouvrage.

Introduction

JavaScript, c’est chaud ! Celui qui a débuté comme un langage « rapide et facile à apprendre et à utiliser » créé pour l’un des premiers navigateurs Web est devenu le langage de programmation le plus populaire au monde. Et la demande de programmeurs JavaScript continue à croître en permanence.

Ce livre est votre point d’entrée pour apprendre, comprendre et devenir efficace avec les concepts clés de JavaScript. Que votre but soit de vous (re)convertir professionnellement dans la programmation en JavaScript, ou plus simplement de rendre votre propre site Web plus interactif, vous pouvez être assuré que le contenu et les techniques présentés dans ce livre sont en phase avec les standards et les meilleurs pratiques JavaScript les plus récents.

Couplé avec de nombreux exercices, à effectuer vous-même ou à télécharger en ligne, chaque chapitre contient des exemples de code réel que vous pouvez essayer et tester chez vous dans votre navigateur Web préféré (plusieurs, c’est encore mieux).

Pour devenir un champion de tennis, il n’y a pas de mystère : il faut s’entraîner, s’entraîner et encore s’entraîner. C’est exactement pareil pour la programmation. Pour devenir un champion de JavaScript, il faut coder, coder et encore coder !

À propos de ce livre

Ce livre est un guide amical et abordable pour commencer à écrire du code JavaScript. Comme langage de programmation, JavaScript est plutôt facile à appréhender. Il est tout à fait possible de commencer très vite à l’utiliser. Du fait qu’il est si accessible, de nombreuses personnes ayant débuté comme auteurs de pages Web se sont retrouvées dans la position de devenir responsables de l’écriture, de la modification et de la maintenance de code JavaScript. Si c’est ce que vous recherchez, ce livre devrait vous permettre de vous mettre rapidement au travail.

Que vous ayez déjà ou non une petite expérience de JavaScript, ce livre vous montrera comment écrire du « bon » code JavaScript.

Les sujets abordés dans le livre couvrent de multiples sujets, notamment :

» Comprendre les structures de base des programmes JavaScript

» Intégrer JavaScript avec HTML5 et CSS3

» Structurer vos programmes à l’aide de fonctions

» Travailler avec les objets JavaScript

» Utiliser des techniques JavaScript avancées, comme les objets, Ajax, les rappels et les fermetures

» Aborder jQuery

Apprendre JavaScript, ce n’est pas seulement apprendre la syntaxe d’un langage. C’est aussi accéder à une horde d’outils, et à la communauté qui s’est construite autour de ce langage. Les programmeurs professionnels ont largement fait évoluer les outils et les techniques utilisés en JavaScript tout au long d’une histoire déjà longue et riche. Tout au long de ce livre, nous mettrons en exergue les bonnes pratiques, ainsi que les outils servant à tester, documenter et écrire plus rapidement du meilleur code !

Pour rendre le livre plus facile à lire, nous utiliserons quelques conventions :

» Tout le code JavaScript, ainsi que les balises HTML et CSS, sera mis en évidence ainsi :

 document.write("Hello !");

» Les marges d’une page de livre n’offrent pas le même espace que la surface de votre écran. C’est pourquoi de longues lignes de code HTML, CSS et JavaScript peuvent se trouver réparties sur plusieurs lignes de texte. Mais n’oubliez pas que, pour votre ordinateur, il s’agit dans ce cas d’une seule et même ligne. Pour éviter la confusion, nous ajouterons dans ce cas une indentation au début de la ou des lignes suivantes, comme ici :

document.getElementById("unElementDansLeDocument").
        addEventListener("click",faireQQChose,false);

» HTML et CSS ne sont pas réellement soucieux de savoir si vous utilisez des majuscules, des minuscules ou une combinaison des deux. JavaScript, par contre, est très pointilleux à ce sujet. Pour obtenir les résultats voulus avec les exemples de code de ce livre, veillez à respecter scrupuleusement l’utilisation des majuscules et des minuscules dans tout ce code.

» De même, les noms des fonctions, variables et autres, ne sont pas traduits afin d’éviter aussi bien les risques de confusion que d’erreur. Cela ne devrait pas être bien gênant, sachant que, de toute manière, tous les langages de programmation, et donc JavaScript, ont pour langue maternelle l’anglais (ou plutôt l’anglais américain).

Quelques suppositions stupides

Vous n’avez absolument pas besoin d’être un petit génie de l’informatique, ou un hacker de haut vol, pour comprendre la programmation. Vous n’avez pas non plus besoin de comprendre comment fonctionne la tuyauterie de votre ordinateur. Et il n’est même pas nécessaire de savoir comment compter en binaire.

Pour autant, il faut bien que nous puissions faire quelques suppositions sur vous. Nous partirons donc de l’idée que vous savez allumer un ordinateur, utiliser un clavier et une souris, que vous avez une connexion Internet, et que vous savez ouvrir un navigateur Web. Et si vous avez déjà quelques connaissances sur la manière de créer des pages Web (dont notamment des rudiments de HTML), ce sera parfait pour débuter.

Les autres choses que vous devez savoir pour écrire et exécuter du code JavaScript sont explicitées dans le livre. Et vous comprendrez très vite que l’une des clés en programmation, c’est l’attention portée aux détails.

Icônes utilisées dans ce livre

Voici une liste des icônes dont nous nous servons dans ce livre pour mettre en évidence certains points particuliers :

Cette icône signale des trucs et astuces, ou encore des raccourcis qui vous permettront d’épargner temps et efforts.

C’est quelque chose auquel vous devez prêter une attention particulière et que vous ne devez pas oublier.

Faites attention, très attention. Cette icône pointe le doigt sur des problèmes ou des pièges à éviter.

Il s’agit de détails techniques qui peuvent ou non vous intéresser. Si vous avez des tendances geek, n’hésitez pas à lire ces compléments. Sinon, vous avez parfaitement le droit de passer votre chemin.

Où trouver les exemples du livre ?

Vous pourriez bien entendu retaper de A à Z tous les exemples de code de ce livre. Mais pourquoi se fatiguer inutilement, et de plus devoir corriger de multiples erreurs de frappe, alors qu’il est très facile de télécharger tout le matériau dont vous avez besoin.

Vos points d’entrée sont les suivants :

Dans votre navigateur Web, rendez-vous à l’adresse suivante :

http://www.pourlesnuls.fr/

Cliquez sur l’icône de loupe et commencez à saisir JavaScript, puis cliquez sur l’icône de couverture du livre dans la liste qui s'affiche. Dans la page du livre, cliquez sur l’icône Télécharger. Le fichier à télécharger est petit. Tout devrait donc aller très vite.

Un site compagnon est disponible à l’adresse suivante :

http://www.dummies.com/go/codingwithjavascript

Vous y trouverez une description du livre, ainsi que de nombreux liens vers le site qui vous permet de tester les exemples en « live ».

Un site plus spécifique est dédié à ce livre, à l’adresse :

http://www.codingjsfordummies.com/

Vous pourrez non seulement y télécharger le code original (non traduit) des exemples du livre, mais aussi y trouver des compléments, voire des correctifs.

Enfin, pour accéder à des articles en ligne (et en anglais, bien sûr) qui devraient vous aider à parfaire vos connaissances, ou encore vous proposer des mises à jour, vous pouvez visiter la page :

http://www.dummies.com/extras/codingwithjavascript

Et maintenant ?

Coder avec JavaScript est en fait un vrai plaisir. Une fois que vous aurez chargé un peu de connaissances dans votre besace, le monde des applications Web interactives vous appartiendra !

Nous espérons que vous apprécierez ce livre et que vous aurez envie d’aller encore beaucoup plus loin une fois que vous l’aurez refermé.

Bonne programmation en JavaScript !

IDébuter avec JavaScript

DANS CETTE PARTIE…

Découvrir comment écrire votre premier programme JavaScript

Découvrir comment travailler avec des variables et des tableaux

Découvrir comment travailler avec des opérateurs, des expressions et des instructions

Utiliser des boucles et des branchements dans votre code JavaScript

Trouver les exemples du livre et d’autres ressources sur le Web

Chapitre 1 JavaScript, le langage le plus incompris du monde

DANS CE CHAPITRE :

» Qu’est-ce qu’Arduino ?

» Apprendre à connaître JavaScript

» Comprendre ce que fait JavaScript

» Comprendre pourquoi vous avez besoin de JavaScript

« Les gens me comprennent si mal qu’ils ne comprennent même pas pourquoi je me plains de ce qu’ils ne me comprennent pas. »

Søren Kierkegaard

JavaScript n’a pas toujours été considéré comme il l’est aujourd’hui. Il y a des gens qui l’ont appelé le meilleur et le pire langage de programmation du monde. Mais, notamment ces dernières années, de nombreuses améliorations ont été apportées aussi bien à la manière dont les développeurs écrivent du code JavaScript qu’aux interpréteurs JavaScript eux-mêmes. Ces améliorations font que JavaScript est aujourd’hui un bien meilleur langage qu’il ne l’était dans sa jeunesse.

Dans ce chapitre, vous allez découvrir ce qu’est JavaScript, ainsi que quelques notions sur l’histoire de ce langage. Vous y verrez également ce que fait JavaScript et pourquoi vous avez besoin de le connaître.

N’oubliez pas de visiter le site Web compagnon de ce livre pour y télécharger les exemples développés ici !

JavaScript, c’est quoi ?

Au tout début du Web, les navigateurs n’étaient que de simples lecteurs, comme l’illustre la Figure 1.1. Ils ne possédaient aucune capacité particulière, si ce n’est celle d’afficher du texte dans différentes tailles. Du jour où Microsoft publia Internet Explorer, la guerre des navigateurs commença à faire rage, et leurs fonctionnalités se développèrent très vite. L’un offrit la possibilité d’afficher des images, puis un autre d’utiliser des polices de caractères différentes, puis de faire clignoter le texte, de le déplacer, et toutes sortes d’autres possibilités nouvelles à l’époque.

FIGURE 1.1 : Les premiers navigateurs Web n’étaient pas jolis à regarder.

Très vite, l’idée que les navigateurs devraient être capables de gérer les choses eux-mêmes, plutôt que de se comporter comme des programmes capables d’afficher des documents d’une manière plus ou moins décorative, s’imposa à tout le monde.

La comète Eich

La naissance de JavaScript se situe en 1995 dans les bureaux de Netscape. Le créateur de JavaScript, Brandon Eich, écrivit celui-ci en un temps record (la légende dit que cela lui prit moins de dix jours !). Pour y arriver, il emprunta les meilleures fonctionnalités de divers autres langages de programmation. La ruée vers le marché qui s’ensuivit produisit d’ailleurs quelques bizarreries intéressantes (disons, pour être plus réaliste, des erreurs) dans la conception même du langage. Le résultat fut, et est toujours, une sorte d’espéranto qui semble étonnamment familier (mais c’est une impression trompeuse) aux développeurs déjà familiarisés avec d’autres langages de programmation.

Appelez-moi Mocha

Le nom original de JavaScript était Mocha. La première version bêta du navigateur de Netscape le rebaptisa LiveScript, et son nom de baptême définitif, donc JavaScript, apparut dans le navigateur Netscape 2, en 1995. Très rapidement, Microsoft démonta tout cela et il en introduisit un clone exact dans Internet Explorer, en le nommant Jscript pour échapper à de basses questions matérielles de droits.

Netscape soumit JavaScript à une organisation internationale de standardisation, Ecma International, et il fut adapté et standardisé sous le nom ECMAScript en 1997.

Brandon Eich, le créateur de JavaScript, n’apprécia pas cette dénomination, et le fit savoir vertement en proclamant que ECMAScript était un « nom de marque indésirable qui fait penser à une maladie de peau ».

Non seulement ECMAScript porte un nom très laid pour un langage de programmation, mais le choix par Netscape de JavaScript n’était pas non plus particulièrement heureux. Si vous savez déjà programmer en Java, ou même si vous en avez simplement entendu parler, sachez que, même si les deux langages ont certaines similitudes, il s’agit en fait d’animaux assez différents.

Nous voulons plus d’effets !

Lorsque JavaScript fit ses débuts, il devint rapidement très populaire en tant qu’outil permettant de rendre les pages Web plus dynamiques. L’une des conséquences de l’incorporation de JavaScript dans les navigateurs Web s’appelait DHTML (pour Dynamic HTML). Avec le DHTML, il fut possible de produire toutes sortes d’effets amusants, comme les flocons de neige illustrés sur la Figure 1.2, mais aussi d’afficher des fenêtres pop-up, ou encore des coins de page qui se replient, et surtout des choses plus utiles comme des menus déroulants ou des validations de formulaires.

FIGURE 1.2 : Des flocons JavaScript tombant sur une page Web.

JavaScript, un langage qui se développe

JavaScript entre maintenant dans sa troisième décade. Au fil du temps, il est devenu le langage de programmation le plus utilisé au monde, et virtuellement chaque ordinateur personnel de la planète contient au moins un navigateur Web capable d’exécuter du code JavaScript.

JavaScript est suffisamment souple pour pouvoir être abordé et appris par des non-programmeurs, mais il est aussi suffisamment puissant pour permettre aux développeurs professionnels de tirer le maximum de ses capacités afin de créer des sites Web sur l’Internet, qu’il s’agisse de simples pages ou de sites gigantesques comme ceux de Google, d’Amazon, Facebook et tant d’autres !

QUELQUES ERREURS COURANTES À PROPOS DE JAVASCRIPT

Il s’est de tout temps dit des choses assez vilaines et fausses sur JavaScript. Même si certaines rumeurs ne sont pas inintéressantes, cela ne signifie pas pour autant qu’elles soient toujours vraies. Voici donc quelques erreurs courantes concernant JavaScript :

» Mythe : JavaScript n’est pas un vrai langage de programmation. Réalité : JavaScript est souvent utilisé pour réaliser des tâches triviales dans les navigateurs Web, mais cela ne diminue en rien son statut de langage de programmation. JavaScript possède de multiples fonctionnalités avancées qui ont haussé le niveau de la programmation en général, et qui sont maintenant imitées dans d’autres langages, comme PHP, C++ et même Java.

» Mythe : JavaScript est le fils de Java. Réalité : Absolument pas. Le nom JavaScript a été inventé uniquement pour des raisons marketing, car Java était extrêmement populaire lors de la sortie de JavaScript. Aujourd’hui, c’est plutôt l’inverse qui se produit.

» Mythe : JavaScript est nouveau. Réalité : JavaScript existe depuis plus de vingt ans ! Certains professionnels de la programmation en JavaScript n’étaient même pas nés lors de sa création…

» Mythe : JavaScript est bogué et se comporte de manière différente selon le navigateur utilisé. Réalité : Même si cela s’est avéré autrefois dans certains cas, les concepteurs de navigateurs Web se sont depuis longtemps mis d’accord pour prendre en charge la version standardisée de JavaScript. Par conséquent, tous les navigateurs actuels gèrent le code JavaScript de la même façon.

Un langage de script dynamique

JavaScript est souvent décrit comme étant un langage de script dynamique. Pour comprendre ce que cela signifie, il faut d’abord définir quelques termes et fournir certains éléments de contexte.

Les programmes informatiques sont des séries d’instructions qui font exécuter certaines actions par un ordinateur. Tout langage de programmation possède à cet effet un jeu d’instructions, et une certaine méthode qui permet à des êtres humains de lire ces instructions. L’ordinateur, de son côté, n’est pas capable de comprendre directement ces instructions. Il a donc besoin d’un traducteur qui transforme ces éléments qu’un programmeur normalement constitué est capable de lire (et même d’écrire) en quelque chose qui lui est familier, et que l’on appelle le langage machine. Selon la manière dont cette traduction est réalisée, on peut classer grossièrement les langages de programmation en deux catégories : ceux qui sont compilés et ceux qui sont interprétés (voir la Figure 1.3).

FIGURE 1.3 : Les langages de programmation sont classés en fonction du moment où la compilation est réalisée.

Langages de programmation compilés

Les langages de programmation compilés se définissent par le fait qu’un développeur écrit le code, puis l’envoie à un programme spécial appelé un compilateur qui interprète ce code et le convertit en langage machine. L’ordinateur peut ensuite exécuter le programme ainsi compilé.

Les langages de programmation compilés les plus connus sont C, C++, Fortran Java, Objective-C ou encore COBOL.

Langages de programmation interprétés

Les langages de programmation interprétés sont, d’un point de vue technique, compilés par l’ordinateur pour les convertir en langage machine. Mais ce processus ne se produit qu’au moment où le navigateur Web (dans le cas de JavaScript) doit exécuter le code. Les développeurs qui écrivent des programmes en langage interprété n’ont pas à se soucier des questions de compilation, puisque leur code ne sera converti qu’au moment de son exécution.

L’intérêt d’un langage interprété, c’est qu’il est possible et facile de modifier le programme à tout moment. L’inconvénient, par contre, est que la phase de compilation lors de l’exécution ajoute une étape au processus, ce qui peut évidemment nuire aux performances du programme.

Du fait de ce facteur de performances, entre autres, les langages interprétés ont souvent eu la réputation d’être moins « sérieux » que les langages de programmation compilés. Cependant, du fait que les compilateurs « à la volée » sont devenus très performants, et les processeurs des ordinateurs de plus en plus rapides, cette perception a énormément évolué. Et JavaScript a eu à cet égard un grand impact.

Parmi les langages de programmation interprétés, il convient de citer PHP, Perl, Haskell, Ruby et, bien entendu, JavaScript.

Il fait quoi, JavaScript, en réalité ?

Si vous utilisez le Web, vous vous servez tout le temps de JavaScript. La liste de choses que JavaScript est capable de réaliser est immense, en allant par exemple du simple rappel qui vous est envoyé lorsque vous oubliez de remplir un champ obligatoire dans un formulaire, jusqu’à des « monstres informatiques » tels que Google Docs ou Facebook. Voici une brève liste des applications les plus courantes de JavaScript sur le Web :

» Créer des effets chic et choc

» Valider des saisies

» Créer des effets d’enroulement

» Créer des menus déroulants ou contextuels

» Gérer le glisser et déposer

» Faire défiler des pages Web à l’infini

» Compléter automatiquement des champs

» Créer des barres de progression

» Tabuler à l’intérieur de pages Web

» Créer des listes pouvant être triées

» Proposer des zooms « magiques » (voir la Figure 1.4)

FIGURE 1.4 : Les effets de zoom dits « magiques » sont réalisés à l’aide de JavaScript.

Pourquoi JavaScript ?

JavaScript est devenu le standard pour créer des interfaces utilisateur dynamiques pour le Web. Pratiquement chaque fois que vous visitez une page Web qui contient des animations, des données évolutives, un bouton dont l’aspect change lorsque vous le survolez, ou encore un menu déroulant, vous pouvez être certain que JavaScript est entré en action. Du fait de sa puissance et de sa capacité à s’exécuter dans virtuellement n’importe quel navigateur Web, JavaScript est devenu l’outil le plus populaire et le plus nécessaire que tout développeur Web moderne doit utiliser.

JavaScript est facile à apprendre

N’oubliez pas que les langages de programmation ont été conçus pour permettre aux êtres humains que nous sommes de dialoguer avec les ordinateurs et de leur expliquer ce que nous voulons faire. Par comparaison avec le langage machine, celui que comprennent les ordinateurs, n’importe quel autre langage de programmation, qu’il soit compilé ou interprété, est facile à apprendre et à comprendre. Pour vous donner une idée des instructions auxquelles votre ordinateur est capable d’obéir, voici un exemple de code en langage machine chargé simplement d’écrire les mots « Hello, World » (voir la Figure 1.5).

FIGURE 1.5 : Tu dis quoi, Machine ?

Regardez maintenant comment vous pouvez accomplir cette tâche toute simple en JavaScript :

alert("Hello, World") ;

C’est bien plus facile, non ?

Une fois que vous avez appris les règles de base du code de la route (ce que l’on appelle la syntaxe), par exemple quand utiliser des parenthèses et quand utiliser des accolades ({}), JavaScript finit par ressembler à peu près à de l’anglais courant.

La première étape de l’apprentissage d’un langage, et donc aussi d’un langage informatique, consiste à surmonter la crainte de se lancer. Avec JavaScript, inutile d’avoir peur. Il existe sur le Web des milliers d’exemples de code JavaScript que tout un chacun peut récupérer et utiliser selon ses besoins. Il est en fait très facile de récupérer les outils dont vous avez besoin (voyez à ce sujet le Chapitre 2), et vous pouvez donc commencer à programmer en JavaScript en partant de petites réalisations, pour évoluer progressivement vers des créations beaucoup plus ambitieuses.

Où est JavaScript ? JavaScript est partout !

Bien que JavaScript ait été conçu à l’origine pour s’intégrer dans les navigateurs Web, il a trouvé sa place dans bien d’autres domaines. Aujourd’hui, on le trouve dans les smartphones et les tablettes, sur des serveurs Web, dans des applications du bureau, de même que dans toutes sortes de dispositifs connectés portables.

JavaScript et les navigateurs

L’endroit le plus courant pour trouver JavaScript, et là où il a été conçu à l’origine, c’est bien entendu dans les navigateurs Web. Lorsqu’il fonctionne de cette manière, on parle de JavaScript côté client.

Dans cette position, JavaScript ajoute de l’interactivité aux pages Web. Il accomplit cela de plusieurs manières :

» En contrôlant le navigateur lui-même et se servant des fonctionnalités de celui-ci.

» En manipulant la structure et le contenu des pages Web.

» En manipulant les styles des pages Web (comme leur mise en page ou les polices de caractères utilisées).

» En accédant à des données provenant d’autres sources.

Pour comprendre comment JavaScript est capable de gérer la structure et le style des pages Web, vous devez en savoir un peu plus sur HTML5 et sur CSS3.

HTML5

HTML (pour Hypertexte Markup Language, ou langage de balisage hypertexte), est le langage utilisé pour structurer les pages Web. Il travaille en se servant d’un jeu de balises afin de décomposer les contenus (textes et images) en éléments donnant aux navigateurs Web des informations sur ces contenus, et ce en définissant par exemple ce qui constitue un titre, où commence et où s’arrête un paragraphe, où une image doit être affichée, et ainsi de suite. Le code suivant vous montre un document HTML tout simple. Le résultat est illustré sur la Figure 1.6.

<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<head>
  <title>Hello, HTML !</title>
</head>
<body>
  <h1>Et voici HTML</h1>
  <p id="introduction">Ce simple document a été écrit en HTML (Hypertext Markup
Language).</p>
</body>
</html>

FIGURE 1.6 : Un exemple très simple de page Web écrite en HTML.

La seconde ligne, celle qui commence par la balise meta, sert à indiquer que le jeu de caractères français doit être utilisé par le navigateur. Sans cela, nos accents seraient remplacés par des signes bizarroïdes ! Vous retrouverez donc cette balise, qui doit être placée juste en dessous de <html>, dans tous les exemples de code de ce livre.

Voici tout ce que vous devez savoir pour l’instant sur HTML de manière à pouvoir vous lancer dans l’apprentissage de JavaScript :

» En HTML, les termes entourés par des crochets obliques sont appelés des balises.

» Une balise de fin (ou de terminaison), autrement dit celle qui est placée à la fin du passage ainsi marqué, se caractérise par la présence d’une barre oblique à la suite du crochet ouvrant. Exemple : </p>.

» Un groupe de deux balises (une ouvrante et une fermante), plus tout ce qui apparaît entre les deux, est appelé un élément.

» Les éléments sont généralement organisés d’une manière hiérarchique (autrement dit, il y a des éléments imbriqués dans d’autres éléments).

» Les éléments peuvent contenir des paires nom/valeur, appelées attributs. Si un élément possède des attributs, ils sont placés dans la balise ouvrante. Une paire nom/valeur assigne une valeur, placée entre guillemets ou entre apostrophes, à un nom (qui, lui, n’est pas mis entre guillemets ou apostrophes). Cette affectation est matérialisée par la présence d’un signe d’égalité. Dans cet exemple, les noms width (largeur) et height (hauteur) sont deux attributs de l’élément de structuration de page appelé div : <div width=”100” height=”100”></div>

» Certains éléments ne possèdent pas de contenu, et ils n’ont donc pas besoin de balise de fin. Par exemple, la balise img, qui insère simplement une image dans une page Web, ressemble à ceci :

<img src="monimage.jpg" width="320" height="200" alt="Ceci est une image de mon poisson rouge">

Toutes les données nécessaires à l’affichage de l’image sont incluses dans cette unique balise. Il est donc inutile d’en ajouter une autre.

Lorsque vous écrivez une page en HTML, vous pouvez inclure du code JavaScript directement dans votre document, ou bien encore faire référence à du code JavaScript externe (c’est-à-dire à un fichier ayant pour suffixe .js). Dans les deux cas, le navigateur Web va charger le code JavaScript et l’exécuter lorsque l’utilisateur ouvre la page concernée.

JavaScript en mode côté client s’exécute à l’intérieur de votre navigateur Web.

CSS3

Les feuilles de style en cascade (ou CSS) est le langage utilisé pour ajouter des styles de formatage et de disposition aux pages Web. Le mot style, lorsqu’il est utilisé à propos de CSS, fait référence aux multiples aspects qui régissent la manière dont une page Web est présentée à l’utilisateur. Cela concerne notamment :

» les polices de caractères ;

» la taille des caractères ;

» les couleurs ;

» l’arrangement des éléments dans la fenêtre du navigateur ;

» la taille des éléments ;

» les bordures ;

» les arrière-plans ;

» la création de bordures aux coins arrondis autour des éléments.

Comme JavaScript, CSS peut être placé directement dans un document HTML, ou bien être stocké dans un fichier qui est lié à ce document (ce qui est de loin préférable pour la commodité de la lecture et de la compréhension). Une fois chargé, il se met immédiatement au travail et il formate le document en fonction des spécifications qu’il contient.

Les feuilles de styles CSS sont formées de règles CSS, qui contiennent des propriétés et des valeurs destinées à être appliquées à un élément ou à un groupe d’éléments. Par exemple :

p{font-size: 14px; font-color: black; font-family: Arial; sans-serif}

Cette règle, en la lisant de gauche à droite, spécifie que tous les éléments de type p (c’est-à-dire les paragraphes en HTML) devraient être affichés dans un corps de 14 pixels, en noir, et en utilisant la police Arial. Si celle-ci n’est pas présente sur l’ordinateur de l’utilisateur, le navigateur utilisera une police sans empattement du même genre.

La partie de la règle CSS qui se trouve en dehors des accolades est appelée le sélecteur. Il permet fort justement de sélectionner les éléments auxquels s’appliquent les propriétés spécifiées à l’intérieur de ces accolades.

Ce livre n’est pas dédié à HTML ou CSS, mais bel et bien à JavaScript. Nous fournirons donc uniquement des informations suffisantes pour pouvoir vous montrer comment HTML et CSS travaillent. Si vous voulez aller plus loin, vous trouverez évidemment des ouvrages dédiés à ces sujets dans la vaste collection Pour les Nuls.

JavaScript est puissant !

Autrefois, JavaScript avait mauvaise réputation auprès des programmeurs du fait de sa lenteur d’exécution dans les navigateurs. De nos jours, la situation a considérablement évolué, et JavaScript fonctionne presque aussi vite que du code compilé (enfin, disons à 80 % de celui-ci). Et il progresse en permanence. Cela signifie que le JavaScript d’aujourd’hui est bien plus puissant que celui qui prévalait-il y a quelques années. Et encore beaucoup plus puissant que le JavaScript des origines, en 1995.

JavaScript est demandé !

JavaScript est non seulement le langage de programmation le plus largement connu à l’heure actuelle, mais c’est aussi l’un des plus demandés chez les professionnels. Les projections indiquent que la demande de développeurs JavaScript devrait croître de 22 % entre 2010 et 2020. L’avenir de JavaScript semble donc florissant, voire même glorieux, et c’est donc le bon moment pour l’apprendre.