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

This article mainly explains "what is the usage and matters needing attention of localStorage". The content of the explanation is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "what is the usage of localStorage and what matters needing attention?"

LocalStorage introduction

In HTML5, in order to solve the problem of insufficient storage space in cookie (the storage space of each cookie in cookie is 4k), a localStorage is added, which is mainly used as local storage.

The capacity supported by general browsers in localStorage is 5m, and the capacity of localStorage varies from browser to browser.

Browser support for localStorage using localStorage

Use in localStorage code

In a project, the first thing you need to do to use localStorage is to determine whether the browser supports it.

If (! window.localStorage) {alert ("browser does not support localstorage");} else {/ / main logic business console.log ('Hello worldview');}

LocalStorage setting syntax

If (! window.localStorage) {alert ("browser supports localstorage");} else {var storage=window.localStorage; / / first setting method: storage ["a"] = 1; / / second setting method: storage.b=1; / / third setting method: storage.setItem ("c", 3); console.log (typeof storage ["a"]) / / print the result: String console.log (typeof storage ["b"]); / / print the result: String console.log (typeof storage ["c"]); / / print the result: String}

View the results in the browser:

LocalStorage acquisition

/ / the first method reads var astorage.a; console.log (a); / / the second method reads var b=storage ["b"]; console.log (b); / / the third method reads var c=storage.getItem ("c"); console.log (c)

LocalStorage modification

Var getVal = localStorage.getItem ('myStorage'); if (getVal! = null) {localStorage.setItem (' myStorage','setOk'); console.log ('modified successfully');} else {console.log ('myStorage not found, getVal return value is null');}

LocalStorage deletion

Var getVal = localStorage.getItem ('myStorage'); if (getVal! = null) {localStorage.removeItem (' myStorage'); console.log ('deleted successfully');} else {console.log ('myStorage,getVal not found return value null');}

LocalStorage clears all contents under the current domain name

LocalStorage.clear ()

When a JSON object is stored in localStorage, it needs to be converted into a JSON string, then written, and then converted to a JSON object when reading: (otherwise an error will be reported)

Var storage=window.localStorage;var data= {name:'zhangSan', sex:'1'}; / / convert the object to String. If not, after saving in localStorage, reading the converted json object will report an error var setData=JSON.stringify (data); storage.setItem ("data", setData); / / convert the JSON string to JSON object output var jsonString=storage.getItem ("data"); console.log (typeof jsonString); / / print out String; var jsonObj=JSON.parse (jsonString) Console.log (typeof jsonObj); / / print out Object;localStorage notes

Browsers are not uniform in size, and localStorage is only supported in IE versions above IE8.

At present, all browsers limit the value type of localStorage to string type, which requires some conversion for the JSON object type that is more common in our daily life.

LocalStorage is not readable in the browser's privacy mode

LocalStorage is essentially the reading of strings. If you store too much content, it will consume memory space and cause the page to change into cards.

LocalStorage cannot be crawled by reptiles

Thank you for your reading. the above is the content of "what is the usage and matters needing attention in the use of localStorage". After the study of this article, I believe you have a deeper understanding of the usage and matters needing attention in the use of localStorage, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

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.