Sommaire

Les propriétés de Web Storage

1. Les interfaces

Nous venons de le voir, nous pouvons stocker des informations de manière temporaire avec sessionStorage et de manière permanente avec localStorage. Toutes les propriétés fonctionnent de la même manière avec ces deux systèmes (ces deux interfaces, pour reprendre la terminologie officielle).

L’exemple à télécharger est dans le dossier Chapitre-09-B/exemple-01.html.

2. Ajouter une donnée

Pour ajouter une donnée en stockage local, nous devons utiliser setItem(key, value). Le premier argument est le nom de cette donnée. Le deuxième argument est la valeur de cette donnée.

Voici un exemple simple :

<!DOCTYPE html> 
<html> 
    <head> 
        <meta charset="UTF-8"> 
        <title>Ma page</title> 
    </head> 
    <body> 
        <script> 
            localStorage.setItem("Nom","Aubry"); 
        </script> 
    </body> 
</html>

Ce script ne contient qu’une seule ligne : la création d’un enregistrement local d’une donnée nommée Nom et ayant pour valeur Aubry.

Affichez cette page dans un navigateur, Google Chrome dans cet exemple.

Affichez les outils pour les développeurs. ...