HTML5 LocalStorage Local storage and refreshing value

1. LocalStorage is a local storage, and the storage period is not limited;

2. SessionStorage session storage, the page shutdown data will be lost.

LocalStorage.setITEM (key, value) // storage

LocalStorage.getITEM (key) // Press the key for the value

localstorage.Valueof () // Get the full value

LocalStorage.removeItem (key) // Delete a single value, pay attention to quotation marks

localstorage.clear () // Delete all data

LocalStorage.Length // The number of data obtained

LOCALSTORAGE.KEY (n) // Get the key value of the nn data

Note: LocalStorage and SessionStorage are the same as above.

LocalStorage.key = 1; // Set storage, name key, value 1

LocalStorage.removeItem (key); // Remove the storage key, remember the key plus quotation number

The following is a practical example:

To achieve the input text content locally, to close the browser, and after reopening, the previously entered content is still (commonly entered at the field of vacation in the mobile phone log).

First of all, make a text domain on the page <textarea> </textarea>, below is jquery:

 If (! LocalStorage.getITEM (Text)) // Window object, the previous Window omit the LocalStorage.setItem (text,); // Here to make a blank store, otherwise the NULL display is not good. The if the if the IF is eliminated to the localStorage.text = localStorage.getItem (text); // Take the value $ (textarea) .html (localStorage.text); // Display $ (textarea). / / /There are many here, such as Blur, Change, Keydown, and a timer, which is practical in multi -field storage localStorage.setITEM (text, $ (this) .Val ()); // Re -store});

The above can achieve a practical small function, which reflects that the local storage of H5 is still useful. Of course, if there are many fields, the JSON method is provided to use it! See the following, load from the Internet

 <script type = text/javascript> if (Window.SessionStorage) {alert ('ok');} Else {alert ('fail');} // Set value .Setitem a ', 1); // Var key_a = sessionStorage.getItem ('key_a'); console.log (key_a); // Delete sessionStorage.removeItem ('key_a'); e.getItem ('key_a')); // null SessionStorage.setItem ('Key_b', 1); SessionStorage.setItem ('key_c', 2); // Clear all key value sessionStorage.clear (); console.Log (sessionStorage.key_b );; sessionStorage.key_c );; ('======================='); // The setting value and value can also be used. SessionStorage.key_D = 12; // Valid value var key_d = sessionStorage.key_d; console.log (key_d); // There is a small difference, if this key is gone. One return value undefined, one is null console.log (sessionStorage.Key_null); // UNDEFINED CONSOLE.LOG (sessionStorage.getITEM ('Key_null')); // null cons. ole.log ('========== == Simply demonstrate an example of storing object ======== '); Var obj = {a: 12, b: [1,2,3,4,5], C: {x: a' a ' , y: ['bb', 12, 'cc', {a: 1, b: 2}], z: 1333}}; sessionStorage.Setitem ('page', json.stringify (obj)); // Take VAR PAGE = JSON.PARSE (SessionStorage.getItem ('Page')); console.log (page); // Traversing the following array for (var I = 0; I <page.b.length; I ++) {console. log (page.b [i]);} // traversal object, usually in for (var j in page.c) {console.log (page.c [j])} // Delete key sessionStorage.removeItem ('' '' pay '); </script>

Example: Digger, refresh the page, you can see the effect:

 <div ID = test> </div> <script> var storage = window.localstorage; if (! Storage.getItem (PageloadCount)) e.pageloadcount = PARSEINT (Storage.getItem (PagloadCount ))) + 1; // Must be a format to transform the document.GetelementByid (test) .innerhtml = storage.pageloadcount; // showStorage (); </script>

It should be noted that the local storage of HTML5 can only be stored in a string. When it is stored in any format, it will be automatically converted into a string, so when reading, you need to transform it yourself. This is why PARSEINT must be used in the previous code.

The above is the HTML5 LOCALSTORAGE local storage brushing value that I introduced to you. I hope it will be helpful to everyone. If you have any questions, please leave me a message. Xiaobian will reply to everyone in time. Thank you very much for your support for the VEVB Wulin website!