Shulou(Shulou.com)06/02 Report--

This article mainly introduces "what local storage does html5 have". In daily operation, I believe many people have doubts about what local storage html5 has. The editor consulted all kinds of data and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts about "what local storage does html5 have?" Next, please follow the editor to study!

Html5 local storage has: 1, localStorage, its life cycle is permanent, unless actively clear the localStorage information, otherwise the information will exist forever; 2, sessionStorage, which is only valid in the current session, is cleared after closing the page or browser.

The operating environment of this tutorial: windows7 system, HTML5 version, Dell G3 computer.

HTML5 Web storage is local storage, stored on the client side, including localStorage and sessionStorage. HTML5 Web storage is stored as key / value pairs, usually as strings.

LocalStorage

The localStorage lifecycle is permanent, and unless the localStorage information is actively cleared, it will last forever. The storage data size is generally 5MB, and it is only saved in the client (that is, the browser) and does not participate in communication with the server.

/ / 1. Save data to local / / the first parameter is the saved variable name, and the second is the value assigned to the variable localStorage.setItem ('Author',' local'); / / 2, get the data from the local storage localStorage.getItem ('Author'); / / 3. Delete some saved data localStorage.removeItem (' Author') from the local storage / / 4. Clear all saved data localStorage.clear ()

SessionStorage

SessionStorage is only valid for the current session and is cleared after closing the page or browser. The storage data size is generally 5MB, and it is only saved in the client (that is, the browser) and does not participate in communication with the server.

/ / 1. Save data to local / / the first parameter is the saved variable name, and the second is the value assigned to the variable sessionStorage.setItem ('Author',' session'); / / 2, get the data from the local storage sessionStorage.getItem ('Author'); / / 3. Delete some saved data sessionStorage.removeItem (' Author') from the local storage / / 4. Clear all saved data sessionStorage.clear ()

Complex data storage

All of the above are for the storage of simple data types, but when the data to be stored is an object or an array, direct storage is not possible.

Wrong storage:

Var user = {username: 'liu', password:' 123456'}; sessionStorage.setItem ('user', user); console.log (sessionStorage.getItem (' user'))

At this point, you need to convert the data format.

Before storing data: use JSON.stringify to convert objects into strings

After getting the data: convert the string into an object using JSON.parse

Var user = {username: 'liu', password:' 123456'}; user = JSON.stringify (user); sessionStorage.setItem ('user', user); var account = sessionStorage.getItem (' user'); console.log (account); account = JSON.parse (account) console.log (account)

At this point, the study on "what is the local storage of html5" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.