3.0 KiB
title | localeTitle |
---|---|
Store Data in Web Browsers Storage | 将数据存储在Web浏览器存储中 |
为了管理Web应用程序处理的数据,您不一定需要数据库。 Chrome(版本4及更高版本),Mozilla Firefox(版本3.5及更高版本)和Internet Explorer(版本8及更高版本)以及一系列其他浏览器(包括iOS和Android版本)均支持各自的浏览器存储功能。
浏览器存储有两种主要可能性:
1. localStorage
重新启动浏览器(关闭并再次打开)后,保存到localStorage
对象的任何内容/数据都将可用。为了**将项目保存**到localStorage
,您可以使用方法setItem()
。这个方法必须是一个键和一个值。
Example: localStorage.setItem("mykey","myvalue");
要从**localStorage检索项目** ,必须使用方法getItem
。必须将getItem
方法传递给您要检索的数据的键:
Example: localStorage.getItem("mykey");
您可以使用removeItem()
方法从localStorage
删除项目。必须将此方法交给要删除的项目的键:
Example: localStorage.removeItem("mykey");
要清除整个localStorage
,您应该在localStorage
对象上使用clear()
方法:
Example: localStorage.clear();
2. sessionStorage
保存在sessionStorage
对象中的项目将保留,直到用户关闭浏览器。然后,存储将被清除。
您可以将项目保存到sessionStorage
,请使用sessionStorage
对象上的方法setItem()
:
Example: sessionStorage.setItem("mykey","myvalue");
要从**sessionStorage检索项目** ,必须使用方法getItem
。必须将getItem
方法传递给您要检索的数据的键:
Example: sessionStorage.getItem("mykey");
您可以使用removeItem()
方法从sessionStorage
删除项目。必须将此方法交给要删除的项目的键:
Example: sessionStorage.removeItem("mykey");
要清除整个sessionStorage
,您应该在sessionStorage
对象上使用clear()
方法:
Example: sessionStorage.clear();
将数组保存到localStorage和sessionStorage
您不仅可以将单个值保存到localStorage
和sessionStorage
,还可以保存数组的内容。
在这个例子中,我们有一个带数字的数组:
var ourArray =[1,2,3,4,5];
我们现在可以使用setItem()
方法将其保存到localStorage
或sessionStorage
:
localStorage.setItem("ourarraykey",JSON.stringify(ourArray));
或者,对于sessionStorage
:
sessionStorage.setItem("ourarraykey",JSON.stringify(ourArray));
为了保存,必须首先将数组转换为字符串。在上面显示的示例中,我们使用JSON.stringify
方法来完成此任务。
从localStorage
或sessionStorage
检索数据时,将其转换回数组:
var storedArray = localStorage.getItem("ourarraykey");
ourArray = JSON.parse(storedArray);
或者,对于sessionStorage
:
var storedArray = sessionStorage.getItem("ourarraykey");
ourArray = JSON.parse(storedArray);