摘要

有时需要在浏览器中保存一些数据,特别在app中嵌入的h5页面中,需要在webview中保存一些数据,作为客户端的数据持久化。

h5中web storage有两种存储方式:sessionStorage和localStorage。

sessionStorage:用于存储一次会话的数据,这些数据只有在同一个会话中的页面才能访问到,当会话结束后,数据也随之销毁,可以这样形容sessionStorage,是会话级别的数据存储。

localStorage:用于持久本地数据,除非主动删除,否则数据永远存在。

web Storage和cookie的区别

首先,它们都是存储在客户端的。但cookie的大小是受限制的,并且每次请求服务器,都会带着cookie中的数据。而且cookie,需要指定作用域,不可跨域访问。

web Storage可以通过setItem,getItem,removeItem,clear等方法,操作更方便。cookie则不同,如果你想用js操作cookie,需要自己封装设置和获取cookie的方法。

兼容性

除了万恶的IE7- ,现在的主流浏览器都支持web Storage。可以通过下面的代码判断是否支持web Storage。

    if (window.localStorage) {
console.log("支持");
} else {
console.log("No支持");
};

localStorage和sessionStorage

通过setItem("key","value")设置值。

注意,这里key和value都是string类型的。如果想要存储json,需要将json转换为json字符串。

    window.localStorage.setItem("user", "wolfy");
window.localStorage.setItem("userJson", JSON.stringify({ "name": "wolfy", "age": }));

getItem("key"):获取key对应value

  console.log("name",window.localStorage.getItem("user"));

删除

  window.localStorage.removeItem("user");

清楚所有的值

window.localStorage.clear();

总结

总结,这里只列举了localStorage的用法,seesionStorage的类似。只不过他们的生命周期不同,sessionStorage是会话级别的存储,你可以这样理解,当浏览器关闭的时候,sessionStorage已经没有了,而localStorage仍然存在。

[Html5]sessionStorage和localStorage的区别的更多相关文章

  1. [Html5]sessionStorage和localStorage常见操作

    摘要 [Html5]sessionStorage和localStorage的区别 索引 上篇文章简单介绍了它们的区别,已经常见的用法.那我们能通过. 或者类似dic[key]的方式访问吗?答案是当然可 ...

  2. cookies,sessionStorage 和 localStorage 的区别

    请描述一下 cookies,sessionStorage 和 localStorage 的区别? sessionStorage 和 localStorage 是HTML5 Web Storage AP ...

  3. cookies、sessionStorage和localStorage的区别

    cookies.sessionStorage和localStorage的区别 对比 特性 Cookie LocalStorage SessionStorage 数据的生命周期              ...

  4. 7,请描述下cookies,sessionStorage和localStorage的区别

    7,请描述下cookies,sessionStorage和localStorage的区别 首先,cookie是网站为了标识用户身份而储存在用户本地终端(client side,百科: 本地终端指与计算 ...

  5. 描述一下 cookies,sessionStorage 和 localStorage 的区别?

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...

  6. cookies,sessionStorage,localStorage的区别

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...

  7. cookies,sessionStorage和localStorage的区别

    联系: sessionStorage和localStorage一样,都是用来缓存客户端缓存信息. 他们都只能存储字符串类型对象. 区别: localStorage的生命周期是永久的,除非用户主动清除浏 ...

  8. Cookie、sessionStorage、localStorage的区别

    共同点:都是保存在浏览器端,且同源的.区别:cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递.而sessionStorage和localStora ...

  9. cookies,sessionStorage和localStorage的区别

    共同点:都是保存在浏览器端,且同源的.区别:cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递.而sessionStorage和localStora ...

随机推荐

  1. subroutines of perl

    #!/usr/bin/perl -w @students = qw/Doreen Oskar Elin Sangeet Malin/; &next_student; &next_stu ...

  2. Bzoj1823 [JSOI2010]满汉全席

    Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 1640  Solved: 798 Description 满汉全席是中国最丰盛的宴客菜肴,有许多种不同的 ...

  3. linux挂载远程samba目录

    yum install cifs-utils  #安装cifs协议包 #列出远程目录 smbclient -L 192.100.9.165 -Uadministrator vim /etc/fstab ...

  4. Math.Round四舍五入

    Math.Round函数四舍五入的问题   今天客户跑过来跟我说,我们程序里面计算的价格不对,我检查了一下,发现价格是经过折算后的价格,结果是可能小数位较多,而单据上只能打印两位价格,所以就对价格调用 ...

  5. 通过Calendar类判断是否是周末及是否在指定时间

    package time; import java.sql.Timestamp; import java.util.Calendar; import java.util.Date; public cl ...

  6. TypeScript Class(类)

    传统的JavaScript注重用函数和基于原型的继承来创建可复用的组件,但这可能让用习惯面对对象方式的程序员感到棘手,因为他们的继承和创建对象都是由类而来的.从JavaScript的下一个版本,ECM ...

  7. HDU 1285 确定比赛名次(简单拓扑排序)

    题目链接: 传送门 确定比赛名次 Time Limit: 1000MS     Memory Limit: 65536K Description 有N个比赛队(1 Input 输入有若干组,每组中的第 ...

  8. Swift开发之 (01) 语法

    一 Swift Swift,苹果于2014年WWDC(苹果开发者大会)发布的新开发语言,可与Objective-C*共同运行于Mac OS和iOS平台,用于搭建基于苹果平台的应用程序. Swift是一 ...

  9. rhino(犀牛) --- color control

    create color materials, if "材料赋予方式" is "图层", the color of "材质" is show ...

  10. photoshop工具使用的简单介绍

    photoshop工具使用的简单介绍 我所用PhotoShop版本号是cs6,这里对其主要功能做一个简单介绍. 第一部分: 首先,ps的界面主要分为了6部分: 一.最上面的一行的菜单栏,菜单中有:文件 ...