Home > Developer > Web Develop
There are two types of Web Storage: Sessionstorage and Localstorage (both are limited to the document source level and cannot be shared between non-homologous documents)
1.sessionstorage data placed on the server (ie not supported) is strictly used to store data in a browser session and the data will be deleted immediately after the browser is closed. Span class= "Hljs-number" >2.localstorage data on the client (low version IE (IE6, IE7) is not supported, and the query language is not supported) store data persistently across sessions localstorage and Sessionsto Rage difference: Localstorage can read/modify to the same Localstorage data as long as the same protocol, the same hostname, and the same port. Sessionstorage is a bit more stringent than localstorage, except for protocols, hostnames, and ports, and requires the same window (that is, the browser's tab). Use the same: (Take sessionstorage as an example) 1. Added: Sessionstorage.setitem (key, value); //value can be any data type 2. Get: Sessionstorage.getitem (key); 3. Delete: Sessionstorage.removeitem (key); //Delete the key value of the storage object in the keys to 4. Clear all: Sessionstorage.clear (); //clears all the key values in the storage object 5. Search (check): Sessionstorage.key (); Localstorage.setitem ("x", 1);//stores a value in the name "x" localstorage.x = 1;//adds a key directly to the Web storage object The value pairs Localstorage.getitem ("x");//Gets the value localstorage.x;//retrieves the key/value pair Localstorage.removeitem ("X") directly from the Web storage object;//delete Except for the "X" item. RemoveItem is the only common way to delete a single name-value pair. (because IE8 does not support the delete operator) localstorage.clear ();//delete all. The only way to delete all of the name value pairs in the Stored object//store an array as a string var MyArray = new Array (' First name ', ' Last Name ', ' Email Address '); Localstorage.formdata = Json.stringify (MyArray); Retrieve the string version of the array and convert it to an available JavaScript array var myArray = Json.parse (localstorage.formdata); There is a more practical way to access:
/span> var obj = { name: ' Doctorhou ', describe: ' tall, mighty, handsome ' }; Localstorage.setitem (' Test ', json.stringify (obj)); Json.parse (Localstorage.getitem (' Test ')); When the storage data changes (corresponding events): Window.onstorage Example:
<Body> <H3>Here's my username and password.</H3> <DivID= "username"></Div> <DivID= "Password"></Div> <Script> //1. Get Objects varusername=document.getElementById ('username'); varPassword=document.getElementById ('Password'); //2. Write stored data into two divusername.innerhtml=Localstorage.getitem ('username'); Password.innerhtml=Localstorage.getitem ('Password'); //3. Do stroage event monitoringWindow.onstorage= function(e) {//storageevent //Console.log (e); //Console.log (E.key); modified key //Console.log (E.oldvalue); The original value //Console.log (e.newvalue); new valueusername.innerhtml=E.newvalue; } </Script> </Body>
Web Storage mechanisms (Localstorage and Sessionstorage)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
