本地存储window.sessionStorage

特点
1、生命周期为关闭浏览器则数据不存在；
2、在同一个窗口下数据可以共享；
3、以键值对的形式存储（'key','value'）;

HTML

<input type="text" name="" id="">
    <button class="set">存储数据</button>
    <button class="get">获取数据</button>
    <button class="remove">删除数据</button>
    <button class="delete">清除数据</button>

JS

    var ipt = document.querySelector('input');
    var set = document.querySelector('.set');
    var get = document.querySelector('.get');
    var remove = document.querySelector('.remove');
    var del = document.querySelector('.delete');

    // 鼠标点击存储数据
    set.addEventListener('click',function(){
        // 获取ipt的value存为变量
        var val = ipt.value;
        // 传给本地存储
        sessionStorage.setItem('uname',val);
        sessionStorage.setItem('age',val);
    })

    // 鼠标点击获取数据
    get.addEventListener('click',function(){
        console.log(sessionStorage.getItem('uname'));
    })

    // 鼠标点击删除数据
    remove.addEventListener('click',function(){
        sessionStorage.removeItem('uname')
    })

    // 清除数据
    del.addEventListener('click',function(){
        sessionStorage.clear();
    })