Apprendre à coder sur pierre-giraud.com

DES COURS COMPLETS ET GRATUITS POUR TOUS

SOMMAIRE

Introduction

  1. Présentation du cours
  2. Introduction au JavaScript
  3. Environnement de travail

Les bases en JavaScript

  1. Où écrire le JavaScript
  2. Syntaxe et commentaires
  3. Découverte des variables
  4. Les types de valeurs
  5. Opérations sur les variables
  6. La concaténation
  7. Présentation des conditions
  8. Les conditions if, if...else, if...else if...else
  9. Opérateurs logiques
  10. Evaluation / Simplification des conditions
  11. Conditions ternaires
  12. Switch
  13. Les boucles
  14. Découverte des fonctions
  15. Test n°1

Les objets en JavaScript

  1. Définition et découverte
  2. Valeurs primitives et objets
  3. Créer des objets
  4. Les méthodes de l’objet String
  5. Les méthodes de l’objet Number
  6. Découverte de l’objet Array
  7. Les méthodes de l’objet Array
  8. Découverte de l’objet Date
  9. Les méthodes de l’objet Date
  10. L’objet Math et ses méthodes
  11. Test n°2

Notions avancées sur les fonctions

  1. La portée en JavaScript
  2. Les fonctions anonymes
  3. Les fonctions auto-invoquées
  4. Les closures JavaScript
  5. Test n°3

Le DOM HTML

  1. Découverte du DOM HTML
  2. Accéder à un élément HTML
  3. Modifier du contenu HTML
  4. Ajouter et insérer des éléments HTML
  5. Modifier ou supprimer des éléments HTML
  6. Naviguer dans le DOM
  7. Les évènements en JavaScript
  8. AddEventListener()
  9. Propagation des évènements
  10. L'objet Event
  11. Test n°4

Le BOM - Browser Object Model

  1. Le BOM et l'objet Window
  2. L'objet Screen
  3. L'objet Navigator
  4. L'objet Location
  5. L'objet History
  6. Test n°5

Les expressions régulières

  1. Découverte des regex en JavaScript
  2. Recherches et remplacements
  3. Les quantifieurs et les options
  4. Les classes de caractères et les méta-caractères
  5. Test n°6

JavaScript et formulaires

  1. Rappels sur les formulaires en HTML
  2. Validation HTML des formulaires
  3. Validation JavaScript des formulaires
  4. Test n°7

L'élément HTML canvas

  1. Découverte de l'élément canvas
  2. Dessiner des rectangles
  3. Dessiner des lignes
  4. Dessiner des arcs de cercle
  5. Créer des dégradés
  6. Insérer du texte et des images
  7. Incliner un dessin
  8. Test n°8

Notions avancées

  1. Gestion du délai d'exécution
  2. La gestion des erreurs
  3. Le mode strict
  4. Test n°9

Conclusion

  1. Conclusion - Aller plus loin

LES COOKIES EN JAVASCRIPT

Présentation des cookies

Un cookie est un petit fichier, contenant généralement une seule donnée, qui va être stocké sur votre ordinateur.

Les cookies sont très pratiques car ils permettent de conserver des informations et donc de pouvoir s’en resservir.

En effet, normalement, une fois la page web envoyée, il n’y a aucun moyen de se souvenir « simplement » des données envoyées par l’utilisateur.

Grâce aux cookies, on va pouvoir se rappeler de son nom par exemple, ou des préférences qu’il a indiquées.

Les cookies ne sont donc pas « dangereux » en soi comme certains le disent. Ce qui peut être dangereux, c’est si un programme malveillant arrive à intercepter les informations qu’ils contiennent.

Notez que les cookies ne durent jamais éternellement. Lorsque l’on va créer un cookie, on va lui attribuer une durée de vie.

L’utilisateur peut également à tout moment supprimer les cookies de son ordinateur ; vous devez en tenir compte si vous les utilisez sur votre site.

Créer un cookie en JavaScript

Pour créer un cookie, on va utiliser la propriété cookie de l’objet Document.

Le minimum pour créer un cookie est de lui donner un nom et une valeur comme ceci :

Création d’un cookie en JavaScript

Si on ne précise pas explicitement de date d’expiration, le cookie sera supprimé par défaut lorsque le navigateur sera fermé.

On va pouvoir préciser une date d’expiration avec le mot clef expires. Vous devez évidemment fournir une date avec un format valide afin que cela fonctionne.

On donne une date d’expiration à notre cookie en JavaScript

Notre cookie expirera donc le 31 décembre 2015 sauf si l’utilisateur le supprime manuellement de son ordinateur avant.

Notez que l’on sépare les différents binômes « information=valeur » par des points virgules.

Finalement, on peut encore préciser un chemin ou un répertoire dans lequel le cookie pourra être lu et utilisé avec le mot clef path. Par défaut, le cookie appartient à la page dans laquelle il a été créé.

On utilise path pour préciser le répertoire sur lequel est valable un cookie en JavaScript

En indiquant la valeur /, on indique que le cookie est valide sur tout le domaine, c’est-à-dire sur tout notre site.

Récupérer et lire les informations d’un cookie en JavaScript

Pour lire nos cookies, nous allons utiliser document.cookie.

Attention cependant, cette façon de faire va retourner tous les cookies d’un coup dans une chaine de caractères comme vous pouvez le voir ci-dessous.

Lire les informations contenues dans un cookie en JavaScript

On affiche le contenu de la variable contenant les informations des cookie

Essayer ce code !

Si vous essayez le code ci-dessus, il est possible que d’autres cookies s’affichent. Cela peut être soit des cookies d’environnement, soit des cookies que vous aviez déjà créés précédemment sur votre page de code.

Modifier ou supprimer un cookie

Pour modifier un cookie, il suffit de le réécrire avec le même nom et en changeant les autres informations.

Notez qu’on ne va pas pouvoir changer le nom d’un cookie : si l’on change de nom, cela sera considéré comme un autre cookie et ça n’effacera pas le premier.

Pour supprimer un cookie, la méthode la plus simple est de le réécrire à l’identique mais en précisant cette fois-ci une date d’expiration passée.

On modifie ou efface nos cookies

Pour supprimer un cookie, on lui attribue une date d’expiration passée

Essayer ce code !

Utiliser des fonctions

Si vous êtes amenés à beaucoup manipuler des cookies, il peut être intéressant de créer des fonctions pour automatiser la création, la lecture ou la suppression de cookies.

Voici le script que je vous propose. Celui-ci est commenté un maximum afin que vous compreniez bien tout ce qui est fait.

Création de fonction pour créer, afficher et supprimer des cookies

On test nos fonctions JavaScript de création et de suppression de cookies

Essayer ce code !

Chapitre précédent

Chapitre suivant