Analyse des nouvelles fonctionnalités dans le stockage local HTML5, conseils du didacticiel localStorage_html5

Le stockage local de HTML5 correspond aux données stockées localement via le navigateur.
L'utilisation de base est la suivante :

Code JavaScriptCopier le contenu dans le presse-papiers

1.  

Dans ce cas, les données sont enregistrées localement, mais sous quelle forme les données locales sont-elles enregistrées ? Après suivi, on constate que dans le navigateur Chrome, les données sont stockées sous la forme d'un fichier de base de données sqlite.

Sous Windows, il est enregistré sous le chemin de stockage C:Documents and SettingsUser NameLocal SettingsApplication DataGoogleChromeUser DataDefaultLocal (où le nom d'utilisateur fait référence au nom d'utilisateur actuel

Sous Mac, il est enregistré sous /Users/User Name sous le chemin /Bibliothèque/Application Support/Google/Chrome/Default/Local Storage (où le nom d'utilisateur fait référence au nom d'utilisateur actuel). Bien que le suffixe soit .localstorege, il s'agit en fait d'un fichier de base de données SQLite. utilisez sqlite Ouvrez-le et voyez les données à l'intérieur. (Vous pouvez utiliser le composant complémentaire SQLite Manager de Firefox pour l'ouvrir)
Les étapes d'installation du composant sont similaires à l'installation de Firebug. Sélectionnez les outils du menu-->, ouvrez la page des paramètres du composant de pièce jointe, recherchez. pour le mot-clé "SQLite Manager", et installez "SQLite Manager" "Après le plug-in, redémarrez Firefox, vous pouvez voir le module complémentaire "SQLite Manager" dans l'outil, comme indiqué dans l'image ci-dessous :
L'image ci-dessous est pour afficher le fichier de données local qui vient d'être enregistré


L'image ci-dessous montre plusieurs méthodes de stockage local couramment utilisées :
1. Ajouter un stockage local

Code XML/HTML

Copier le contenu dans le presse-papiers

localStorage.setItem("key","value"); //Stocker une valeur "value" avec "key" comme nom

2. Obtenez un stockage local

Code XML/HTML

Copier le contenu dans le presse-papiers

localStorage.getItem("key"); //Obtenir la valeur nommée "key"

3. Supprimer localStorage

Code XML/HTML

Copier le contenu dans le presse-papiers

localStorage.removeItem("key"); //Supprimer les informations nommées "key"

4. Effacer le stockage local

Code XML/HTML

Copier le contenu dans le presse-papiers

localStorage.clear(); //Effacer toutes les informations dans localStorage

5. Afficher le stockage local enregistré

Vous pouvez le visualiser via l'outil de console du navigateur Chrome Resource–Local Storage