In summary localStorage knowledge stored locally (simple realization page Login Register function)

1. What is localStorage

To be used as local storage, to solve the problem of insufficient storage space cookie (cookie cookie in each storage space for 4k), localStorage generally supported by the browser size is 5M, this will localStorage in different browsers different.

2, localStorage advantages and limitations

Advantage:
A, localStorage expand the cookie 4K limit
b, localStorage will be the first request directly to local data storage, the equivalent of a 5M size for the front page of the database, compared to the cookie can save the bandwidth , but this is only in the high version of the browser was supported

Limitations:
A, size of the browser is not unified, more than IE8 IE version only supports localStorage this attribute
b, all current browsers will put localStorage value type is defined as string type, this our daily more common JSON object need some type of conversion
c, localStorage in the browser's privacy mode following is unreadable
d, on localStorage is essentially a reading of the string, if the stored content and more words will consume memory space will cause the page to change card

3, localStorage local store operation: CRUD

By:
There are three options

var ls = window.localStorage;
ls.aa = 1;
ls["bb"] = 2;
ls.setItem("cc",3);

length of the property to get the number of key

check:

console.log( ls.aa , ls["bb"] , ls.getItem("cc") );  //取出对象中键对应的值

Change:
three scenarios

ls.setItem("aa",33);
ls.aa = 22;
ls["aa"]=77;

Delete:
First, remove all the contents of localStorage using the clear () method

var storage=window.localStorage;
storage.a=1;
storage.setItem("c",3);
console.log(storage);
storage.clear();
console.log(storage);

Second, the localStorage is a key to delete

var storage=window.localStorage;
storage.a=1;
storage.setItem("c",3);
console.log(storage);
storage.removeItem("a");//无论以哪种方式存储都可以使用该方法删除
console.log(storage.a); 

4, localStorage two methods how objects stored

And conversion target string:
the JSON.parse () // String object-object (if the current string is taken out on the array, it is necessary to string to an object)
the JSON.stringify () // object-character string object (character string is stored only type, so when the stored object needs to string object)

5. Summary:

The basic method of localStorage:
definitions: localStorage.setItem ( 'key', ' value')
acquisition: localStorage.getItem ( 'key')
Delete: localStorage.removeItem ( 'key')
Clear: localStorage.clear ()
Storage of a length property to get the number of keys in storage

// instance
Detailed basic method localStorage
// use local storage function achieved Login Register
Log in using local storage to achieve registration function
Log in using local storage to achieve registration function

Guess you like

Origin blog.csdn.net/ZHANGJIN9546/article/details/93157543