localStorage , sessionStorage ,cookie 使用介绍
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>存储</title>
</head>
<body>
<div>
localStorage
</div>
<div>
sessionStorage
</div>
<div>
cookie
详细介绍 http://www.cnblogs.com/pangzi666/p/5889948.html
</div>
<script type="text/javascript"> // 设置存储
localStorage.a = ;//设置a为"3"
localStorage["a"] = "sfsf";//设置a为"sfsf",覆盖上面的值
localStorage.setItem("b","isaac");//设置b为"isaac"
// 读取存储
var a1 = localStorage["a"];//获取a的值
var a2 = localStorage.a;//获取a的值
var b = localStorage.getItem("b");//获取b的值
// 删除存储
// localStorage.removeItem("b");//清除c的值
// localStorage.clear(); // 清除所有 // .key() 获取 localstorage 的键值
function localStoragea(){
for(var i = ;i<localStorage.length;i++){
console.log(localStorage.key(i));
}
}
localStoragea(); // 需要注意的是,HTML5本地存储只能存字符串,任何格式存储的时候都会被自动转为字符串,所以读取的时候,需要自己进行类型的转换 // sessionStorage
// 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。
// 用法和localStorage 基本一样 // cookie
// cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下。存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识。
</script>
</body>
</html>
我们也可以把它简单封装一下
function SetLS(key, json){
window.localStorage.setItem(key, JSON.stringify(json));
} function GetLS(key){
var str = window.localStorage.getItem(key);
if (str != null && str != "")
return JSON.parse(str);
else
return false;
}
function ClearLS(key){
localStorage.clear();
}
有兴趣的可以使用一下。
localStorage , sessionStorage ,cookie 使用介绍的更多相关文章
- localStorage sessionStorage cookie indexedDB
目录: localStorage sessionStorage cookie indexedDB localStorage localStorage存储的数据能在跨浏览器会话保留 数据可以长期保留,关 ...
- localstorage sessionstorage cookie的区别
一.基本概念 Cookie cookie比较小,大小限制在4kb左右,是网景公司的前雇员 LouMontulli 在1993年3月的发明.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记 ...
- 客户端 localStorage, sessionStorage, cookie 的区别
SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据,而且都是字符串类型的键值对! 区别在于前两者属于WebStorage,创建它们的目的便是存 ...
- localstorage sessionstorage cookie 备忘
/* sessionStorage: 保存的数据用于浏览器的一次会话,当会话结束(通常是该窗口关闭),数据被清空: localStorage: 保存的数据长期存在,下一次访问该网站的时候,网页可以直接 ...
- 本地存储 localStorage/sessionStorage/cookie
cookie是个基础的东西.是服务器发送到客户端,存储在客户端的一小段数据.可以存储一些配置信息,客户标识信息等.用户下次访问这个网站时,会把上次网站发来的cookie一同发送回去.cookie保存在 ...
- localStorage,sessionStorage,cookie使用场景和区别
localStorage:HTML5新增的在浏览器端存储数据的方法.设置和获取localStorage的方法: 设置: localStorage.name = 'zjj'; 获取: localStor ...
- localStorage&sessionStorage&Cookie
localStorage.sessionStorage.Cookie三者区别如下:
- localStorage,sessionStorage,cookie区别
localStorage:HTML5新增的在浏览器端存储数据的方法.设置和获取localStorage的方法: 设置: localStorage.name = 'zjj'; 获取: localStor ...
- 浏览器缓存介绍之sessionStorage、localStorage、Cookie
Cookie Cookie 是小甜饼的意思.顾名思义,cookie 确实非常小,它的大小限制为4KB左右,是网景公司的前雇员 Lou Montulli 在1993年3月的发明.它的主要用途有保存登录信 ...
- localStorage sessionStorage 和cookie等前端存储方式总结
localStorage sessionStorage 和cookie localStorage localStorage是本地存储的,除非清空本地数据 localStorage不会自动把数据发给服务 ...
随机推荐
- 创建表结构相同的表,表结构相同的表之间复制数据,Oracle 中 insert into XXX select from 的用法
/**1. 用select 创建相同表结构的表*/create table test_tbl2 as select * from test_tbl1 where 1<>1; /** 2. ...
- jquery.elevateZoom实现仿淘宝看图片,一张小的,一张大用于鼠标经过时候显示
实现这个效果你需要准备两张图片,一张小的,一张大用于鼠标经过时候显示.然后我们只要为img标签添加data-zoom-image属性,其值为大图的地址,最后在javascript中选择该图片调用ele ...
- html背景图片拉伸至全屏
本来想在body的css中设置,但发现怎么弄也无法搞定,技术水平有限吧,最后通过下面方式来达到效果: <img src = 'url' border = '0' width = '100%' h ...
- javascript 闭包理解
摘自:http://www.cnblogs.com/jkswjw/p/3180384.html javascript 闭包基础分享 闭包向来给包括JavaScript程序员在内的程序员以神秘,高深的感 ...
- JDBC连接数据库以及简单的操作
package com.zhiyuan.jdbc.util; import java.sql.Connection;import java.sql.DriverManager;import java. ...
- java web基础 --- URL重定向Filter
java web基础 --- URL重定向Filter httpRequest.getRequestDispatcher("/helloWorld").forward(httpRe ...
- 【转】进程间通信方式总结(windows 和linux)
平时看的书很多,了解的也很多,但不喜欢总结,这不昨天面试的时候被问到了进程间通信的方式,因为没有认真总结过,所以昨天答得不是特别好.现在将linux和windows的进程间通信方式好好总结一下. ...
- html 上传文件
1.html代码 <form id="form1" action="TestYield" method="post" enctype= ...
- oracle关键字(保留字)
其实这个东西可以在oracle 上输入一个sql语句就可以得到: select * from v$reserved_words order by keyword asc; //order 后边不是 ...
- centos 6.5下cmake工具的安装与配置
一.cmake是什么? CMake是一个跨平台的安装(编译)工具,可以用简单的语句来描述所有平台的安装(编译过程).他能够输出各种各样的makefile或者project文件,能测试编译器所支持的C+ ...