Maison > interface Web > Tutoriel H5 > le corps du texte

Explication détaillée de la méthode d'implémentation de localStorage stockant les données JSON et lisant les données JSON en HTML5

高洛峰
Libérer: 2017-03-12 16:12:34
original
1660 Les gens l'ont consulté

localStorage est une méthode fournie par HTML5 pour implémenter le stockage local sur le client. Cependant, la méthode localStorage ne peut stocker que des données chaîne . Parfois, nous devons stocker objets. . En local, par exemple : JSON Alors, comment localStorage peut-il réaliser le stockage et la lecture des données JSON ? Expliquons la solution à tout le monde à travers cet article, jetons un coup d'oeil

localStorage est une méthode fournie par HTML5 pour implémenter le stockage local sur le client, mais la méthode localStorage ne peut stocker que des données de chaîne. Parfois, nous. besoin de stocker des objets localement, tels que JSON ; alors, comment localStorage peut-il réaliser le stockage et la lecture des données JSON ?

Idée : étant donné que localStorage ne peut stocker que des données de chaîne, nous pouvons d'abord convertir l'objet JSON en chaîne, puis le stocker à l'aide de la méthode localStorage lorsque nous avons besoin d'utiliser ces données JSON, lisez-les d'abord. puis convertissez-le en un objet JSON à utiliser.

Le code spécifique est le suivant :


var jsonData = {'name': '张三', 'age': 29}; // 定义一个JSON对象
var str_jsonData = JSON.stringify(jsonData);
console.log(typeof(str_jsonData)); // string
localStorage.setItem('localData', str_jsonData); // 存储字符串数据到本地
var getLocalData = localStorage.getItem('localData'); // 读取字符串数据
console.log(typeof(getLocalData)); // string
var jsonObj = JSON.parse(getLocalData);
console.log(typeof(jsonObj)); // obj
console.log(jsonObj.age); // 29
Copier après la connexion


Extension :

stringify( ) est utilisé pour analyser une chaîne à partir d'un objet ;

parse() est utilisé pour analyser un objet json à partir d'une chaîne.


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!