欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

本地存储之localStorage

程序员文章站 2022-06-02 23:45:17
源码可以到GitHub上下载! localStorage: 存储上限限制:不同的浏览器存储的上限也不一样,但大多数浏览器把上限限制在5MB以下。 localStorage与sessionStorage的区别:就是localStorage属于永久性存储,而sessionStorage属于当会话结束的时 ......
源码可以到github上下载!
localstorage:
  存储上限限制:不同的浏览器存储的上限也不一样,但大多数浏览器把上限限制在5mb以下。

  localstorage与sessionstorage的区别:就是localstorage属于永久性存储,而sessionstorage属于当会话结束的时候,sessionstorage中的键值对会被清空

  关闭浏览器后,再打开仍有数据

  清除缓存加载后仍有数据

  同网络地址页面均能得到数据
        // localstorage使用示例
        var username = document.getelementbyid("username"); // 获取input username
        var userpwd = document.getelementbyid("userpassword"); // 获取input userpassword
        var remember = document.getelementbyid("remember"); // 获取记住账号密码
        // 点击复选框记住 账号、密码、复选框
        function remembervalue() {
            if (remember.checked == true) {
                localstorage.setitem('user', username.value);
                localstorage.setitem('pwd', userpwd.value);
                localstorage.setitem('remember', remember.checked);
            } else {
                localstorage.removeitem("user");
                localstorage.removeitem("pwd");
                localstorage.removeitem("remember");
                // localstorage.clear();// 全部删除
            }
        }
        // 页面加载完毕后从localstorage里读取值并填入相应的标签内
        window.onload = function () {
            username.value = localstorage.getitem("user");
            userpwd.value = localstorage.getitem("pwd");
            remember.checked = localstorage.getitem("remember");
        }