Use of browser objects localStorage and sessionStorage

 The main difference between them is: one exists locally, the other is a temporary session, and the storage time is different. The data saved in localStorage exists for a long time. When we visit the website next time, the webpage can directly read the data saved before; the data saved in sessionStorage is used for a session of the browser. When the session ends, such as closing the browser After the window, the data will be cleared. Aside from the difference in shelf life, the two objects are otherwise identical. The data they store is in the form of "key-value pairs". That is, each item of data has a key name and corresponding value. All data is stored in the form of strings. Due to cross-domain restrictions, they are only used on the client side and do not communicate with the server side.The size of the stored data is generally 5M.

Use of localStorage

 <button id="btn1">add</button>

    <button id="btn2">remove</button>

    <button id="btn3">clear</button>

    <button id="btn4">get</button>

    <script>

        var btn1=document.getElementById("btn1")

        var btn2=document.getElementById("btn2")

        var btn3=document.getElementById("btn3")

        var btn4=document.getElementById("btn4")

        //

        btn1.onclick=function(){

            localStorage.setItem("name","aaa")

            localStorage.setItem("age","18")

        }

        btn2.onclick=function(){

            localStorage.removeItem("name")

        }

        btn3.onclick=function(){

            localStorage.clear()

        }

        btn4.onclick=function(){

            console.log(localStorage.getItem("age"))

        }

    </script>

The usage of sessionStorage is roughly the same