详解如何获取localStorage最大存储大小的方法


Posted in HTML / CSS onMay 21, 2020

localStorage,sessionStorage,cookie的简单介绍

localStorage:仅在客户端存储不参与服务器通信,存储大小一般为5M,如果不是人为清除,那么即使是关闭浏览器也会一直存在。

sessionStorage:仅在客户端存储不参与服务器通信,存储大小一般为5M,会话级存储,也就是说如果关闭当前页面或者浏览器那么就会清除

cookie:客户端存储,参与服务器通信,存储大小为4k,可设置生命周期,在设置的生命周期内有效

(function() {
    if(!window.localStorage) {
        console.log('当前浏览器不支持localStorage!')
    }    
    var test = '0123456789';
    var add = function(num) {
        num += num;
        if(num.length == 10240) {
            test = num;
            return;
        }
        add(num);
    }
    add(test);
    var sum = test;
    var show = setInterval(function(){
        sum += test;
        try {
            window.localStorage.removeItem('test');
            window.localStorage.setItem('test', sum);
            console.log(sum.length / 1024 + 'KB');
        } catch(e) {
            alert(sum.length / 1024 + 'KB超出最大限制');
            clearInterval(show);
        }
    }, 0.1)
})()

直接在浏览器控制台运行上面的方法。

亲测Chrome浏览器中localStorage最大5120kb,即5M。

到此这篇关于详解如何获取localStorage最大存储大小的方法的文章就介绍到这了,更多相关localStorage最大存储内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS3属性box-shadow使用详细教程
Jan 21 HTML / CSS
基于css3的属性transition制作菜单导航效果
Sep 01 HTML / CSS
纯CSS3单页切换导航菜单界面设计的简单实现
Aug 16 HTML / CSS
css3 clip实现圆环进度条的示例代码
Feb 07 HTML / CSS
CSS3中引入多种自定义字体font-face
Jun 12 HTML / CSS
借助HTML5 Canvas来绘制三角形和矩形等多边形的方法
Mar 14 HTML / CSS
HTML5 Canvas的性能提高技巧经验分享
Jul 02 HTML / CSS
HTML5调用手机摄像头拍照的实现思路及代码
Jun 15 HTML / CSS
HTML5 history新特性pushState、replaceState及两者的区别
Dec 26 HTML / CSS
html5 实现客户端验证上传文件的大小(简单实例)
May 15 HTML / CSS
HTML5实现可缩放时钟代码
Aug 28 HTML / CSS
关于webview适配H5上传照片或者视频文件的方法
Nov 04 HTML / CSS
html5用video标签流式加载的实现
May 20 #HTML / CSS
video.js支持m3u8格式直播的实现示例
May 20 #HTML / CSS
video实现有声音自动播放的实现方法
May 20 #HTML / CSS
基于html5 canvas做批改作业的小插件
May 20 #HTML / CSS
video下autoplay属性无效的解决方法(添加muted属性)
May 19 #HTML / CSS
html2canvas生成的图片偏移不完整的解决方法
May 19 #HTML / CSS
html5简介及新增功能介绍
May 18 #HTML / CSS
You might like
PHP新手上路(九)
2006/10/09 PHP
php中filter_input函数用法分析
2014/11/15 PHP
php从数组中随机选择若干不重复元素的方法
2015/03/14 PHP
PHP 读取文本文件内容并分页显示
2016/01/02 PHP
Laravel5.5新特性之友好报错以及展示详解
2017/08/13 PHP
php通过pecl方式安装扩展的实例讲解
2018/02/02 PHP
PHP设计模式(九)外观模式Facade实例详解【结构型】
2020/05/02 PHP
JQuery 获得绝对,相对位置的坐标方法
2010/02/09 Javascript
利用jQuary实现文字浮动提示效果示例代码
2013/12/26 Javascript
了不起的node.js读书笔记之例程分析
2014/12/22 Javascript
用javascript实现自动输出网页文本
2015/07/30 Javascript
js实现日历的简单算法
2017/01/24 Javascript
详解vue-router2.0动态路由获取参数
2017/06/14 Javascript
Vue.js常用指令之循环使用v-for指令教程
2017/06/27 Javascript
VsCode新建VueJs项目的详细步骤
2017/09/23 Javascript
angular4 共享服务在多个组件中数据通信的示例
2018/03/30 Javascript
jQuery实现鼠标移入移出事件切换功能示例
2018/09/06 jQuery
解决vuejs项目里css引用背景图片不能显示的问题
2018/09/13 Javascript
BootStrap模态框闪退问题实例代码详解
2018/12/10 Javascript
JavaScript面向对象中接口实现方法详解
2019/07/24 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
2019/08/16 Javascript
[03:09]显微镜下的DOTA2第一期——带你走进华丽的DOTA2世界
2014/06/20 DOTA
Python实现栈的方法
2015/05/26 Python
Python 用Redis简单实现分布式爬虫的方法
2017/11/23 Python
python自定义线程池控制线程数量的示例
2019/02/22 Python
python GUI库图形界面开发之PyQt5多行文本框控件QTextEdit详细使用方法实例
2020/02/28 Python
为你的html5网页添加音效示例
2014/04/03 HTML / CSS
美国电子产品折扣网站:Daily Steals
2017/05/20 全球购物
学生无故旷课检讨书
2014/09/20 职场文书
学校师德师风自我剖析材料
2014/09/29 职场文书
代领报检证委托书范本
2014/10/11 职场文书
2014年幼儿园学期工作总结
2014/12/05 职场文书
公务员年终个人总结
2015/02/12 职场文书
导游词之澳门妈祖庙
2019/12/19 职场文书
pytorch 实现在测试的时候启用dropout
2021/05/27 Python
Debian11 Xfce终端光标的颜色怎么设置?
2022/08/14 数码科技