cookie和webstorage
HTML 5 Web 存储
HTML5 提供了两种在客户端存储数据的新方法:
- localStorage - 没有时间限制的数据存储
<!DOCTYPE html>
<html>
<body> <div id="result"></div> <script>
// Check browser support
if (typeof(Storage) !== "undefined") {
// Store
localStorage.setItem("lastname", "Gates");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");
} else {
document.getElementById("result").innerHTML = "抱歉!您的浏览器不支持 Web Storage ...";
}
</script> </body>
</html>Storage.setItem()
setItem()
作为Storage
接口的方法,接受一个键名和值作为参数,将会把键名添加到存储中,如果键名已存在,则更新其对应的值。语法
storage.setItem(keyName, keyValue);
参数
返回值 无
- sessionStorage -
sessionStorage 方法
sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。
如何创建并访问一个 sessionStorage:
<body>
<div id="result"></div>
<script>
if (typeof(Storage)!=="undefined") {
sessionStorage.setItem("lastname","Gates");
document.getElementById("result").innerHTML = sessionStorage.getItem("lastname");
}else{
document.getElementById("result").innerHTML = "抱歉你所找的內容本瀏覽器暫時不支持";
}
if(sessionStorage.pagecount){
sessionStorage.pagecount = Number(sessionStorage.pagecount)+1;
}else{
sessionStorage.pagecount = 1;
}
document.write("visits的次數為"+sessionStorage.pagecount+"次")
</script>
</body>
cookie和webstorage的更多相关文章
- JavaScript高级编程———数据存储(cookie、WebStorage)
JavaScript高级编程———数据存储(cookie.WebStorage) <script> /*Cookie 读写删 CookieUtil.get()方法根据cookie的名称获取 ...
- cookie,webstorage的理解
在前两天的开发时,遇到一个问题,需要将一个网页在预加载时,优先出一个弹出框,但是再次加载时不希望它出现,在经过一段时间的搜索和尝试之后,发现了大多使用的两种方式:生成cookie和webStorage ...
- 一文梳理Web存储,从cookie,WebStorage到IndexedDB
前言 HTTP是无状态的协议,网络早期最大的问题之一是如何管理状态.服务器无法知道两个请求是否来自同一个浏览器.cookie应运而生,开始出现在各大网站,然而随着前端应用复杂度的提高,Cookie 也 ...
- 兼容cookie和webStorage
html页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...
- cookie与webStorage区别
- WebStorage记录滚动条位置
因关注公众号<HTML5学堂>看到这篇文章 "利用本地存储,记录滚动条的位置" ,便好奇敲来试试,然后又看了一些关于WebStorage的资料 附上这篇文章的地址 ht ...
- 一文带你看懂cookie,面试前端不用愁
本文由云+社区发表 在前端面试中,有一个必问的问题:请你谈谈cookie和localStorage有什么区别啊? localStorage是H5中的一种浏览器本地存储方式,而实际上,cookie本身并 ...
- 什么是cookie(前段时间看到别人简历上把cookie和localStorage混淆了所以专门又去了解了下)
在前端面试中,有一个必问的问题:请你谈谈cookie和localStorage有什么区别啊? localStorage是H5中的一种浏览器本地存储方式,而实际上,cookie本身并不是用来做服务器存储 ...
- 浅谈cookie,sessionStorage和localStorage区别
在客户端存储数据可以使用的技术有如下四种: Cookie技术:浏览器兼容性好,但操作比较复杂,需要程序员自己封装,源生的Cookie接口不友好 H5 WebStorage:不能超过8MB,操作简单: ...
随机推荐
- Nodejs-原型链污染
原型链污染 javascript 原型链 在javascript中,继承的整个过程就称为该类的原型链. 每个对象的都有一个指向他的原型(prototype)的内部链接,这个原型对象又有它自己的原型,一 ...
- 普转提Day2
T1 给定一个区间,求这个区间中只有一个数字与其他数组不相同的数的个数. 给出的区间范围较大,但是要求的数比较少.所以我的想法是这样的:因为这些数只有一个数字和每个数字都相同的数不同,所以考虑将所有数 ...
- python 魔法方法诠释
什么是Python魔法方法 什么是魔法方法呢?它们在面向对象的Python的处处皆是.它们是一些可以让你对类添加"魔法"的特殊方法. 它们经常是两个下划线包围来命名的(比如 ini ...
- 微服务实战系列(十)-网关高可用之中间件Keepalived
1.场景描述 因为要做网关的高可用,用到了keepalived+nginx,来保证nginx的高可用,如下图: 安装了keepavlived,走了一些弯路,记录下吧,nginx的安装就不多说了,博客已 ...
- 软件定义网络实验记录⑤--OpenFlow 协议分析和 OpenDaylight 安装
一.实验目的 回顾 JDK 安装配置,了解 OpenDaylight 控制的安装,以及 Mininet 如何连接: 通过抓包获取 OpenFlow 协议,验证 OpenFlow 协议和版本,了解协议内 ...
- Power Designer建模之餐饮在线点评系统——需求模型实例
总览 一级需求 二级需求 管理门户 会员门户 三级需求 系统管理 企业中心 会员中心 统计分析 四级需求
- 64位Win7下H3C的iMC无法查看“网络拓扑”的解决方法、心路历程
64位Win7下H3C的iMC无法查看"网络拓扑"的解决方法.心路历程
- Java知识系统回顾整理01基础04操作符07Scanner
一.Scanner 需要用到从控制台输入数据时,使用Scanner类. 二.使用Scanner读取整数 注意: 使用Scanner类,需要在最前面加上 import java.util.Scanner ...
- python opencv 读取图片 返回图片某像素点的b,g,r值
转载:https://blog.csdn.net/weixin_41799483/article/details/80884682 #coding=utf-8 #读取图片 返回图片某像素点的b,g ...
- 指针数组学习中的小插曲真是醉了-----Strcmp用法
参考: 1.C++ 从入门到精通第三版: 2.https://blog.csdn.net/liaoshengshi/article/details/45099923 如是多次被别人转载的地址 ...