localStorage local storage technology

localStorage local storage technology

Local storage technology, "is not permanent permanent storage."

Features:

　　　　The stored data to the browser which

　　　　Stored data are stored in the form of a string

And compared to traditional database:

　　　　advantage:

　　　　　　Simple, easy to learn

　　　　　　Data visualization, the most common key: value is stored in the form of

　　　　　　The default data can be viewed only in the homologous state and storage

window.localStorage means that storage technology relies on a browser.

Local storage technology is the top-level objects belonging to the window object can be omitted

Local storage and cookie difference:

It is an enhanced version of the state cookie, more security, homologous to view data storage, access files more secure

Api-based local storage:

　　setItem('key','value')

　　getItem('key','value')

　　removeItem('key')

　　clear()

　　Get length value .length

1      // store 
2       localStorage.setItem ( 'name', 'ADMIN' );
 . 3       localStorage.setItem ( 'Test', to true );
 . 4  
. 5      // Get   
. 6      the let info = localStorage.getItem ( 'Test' );
 . 7           Console .log (info);
 . 8  
. 9      the let info = localStorage.removeItem ( 'Test' )
 10       the console.log (info); 
 . 11  
12 is      the console.log (localStorage.getItem ( 'name')); // if finding content , return null. If present, returns the corresponding key value 
13 is  
14      // get the length 
15      console.log(localStorage.length)
16     // 清空
17     let info = localStorage.clear();
18     console.log(info)
19

Local storage API

1. Save data to local

const info ={
        name: 'dongdong' ,
        age:"23",
        id:"007"
    };
    localStorage.setItem('key',JSON.stringify(info))；

2. get data from a local storage

var data =JSON.parse(localStorage.getItem('key'))
     console.log(data);

3. To remove a local store saved data

localStorage.removeItem ( 'key'); // delete a piece of key data of the key value

4. Delete all saved data

localStorage.clear () // delete all stored data

The monitor changes locally stored

Storage time change (add, update, delete) triggers, change the same page will not trigger occurs, it will listen to other pages with the following change a domain name Storage

window.addEventListener('storage',function(e){
         console.log("key",e.key);
         console.log("oldValue",e.oldValue);
         console.log("newValue",e.newValue);
         console.log("url",e.url);
     })

localStorage local storage technology

Guess you like