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,操作简单: ...
随机推荐
- 想要搭建个论坛？Guide哥调研了100来个 Java 开源论坛系统，发现这 5 个最好用！
大家好!我是 Guide 哥,Java 后端开发.一个会一点前端,喜欢烹饪的自由少年. 最近有点小忙.但是,由于前几天答应了一位读者自己会推荐一些开源的论坛系统,所以,昨晚就简单地熬了个夜,对比了很多 ...
- nginx+tomcat集群方法
下载地址:wget http://nginx.org/download/nginx-1.16.1.tar.gz 解压:tar -zxvf 预编译 nginx+tomcat集群方法: 进入nginx配置 ...
- 转载：python的format格式化输出
https://www.cnblogs.com/chunlaipiupiupiu/p/7978669.html python中format函数 ---恢复内容开始--- python中format ...
- python实现随机复制若干个文件到新目录
python实现随机复制若干个文件到新目录 1说明 1.1 目的 随机选择一个文件下的若干个文件,并将文件复制到新文件夹下 1.2 要求 需要将random_select_and_copy_file. ...
- vue移动端记录列表滚动如何快速找到是哪个元素产生的滚动
使用下面的代码粘贴到调试工具中运行一下,然后滚动页面,就可以看到是哪个元素产生的滚动了 function findscroller(element) { element.onscroll = func ...
- jpa基本常识
1.hibernate更新表结构配置 jpa hibernate框架配置 spring.jpa.properties.hibernate.hbm2ddl.auto = create-drop 其意思是 ...
- 小白也能看懂的Redis教学基础篇——朋友面试被Skiplist跳跃表拦住了
各位看官大大们,双节快乐 !!! 这是本系列博客的第二篇,主要讲的是Redis基础数据结构中ZSet(有序集合)底层实现之一的Skiplist跳跃表. 不知道那些是Redis基础数据结构的看官们,可以 ...
- 在KEIL下查看单片机编程内存使用情况
原文链接:https://blog.csdn.net/D_azzle/article/details/83410141 截至到目前为止,本人接触单片机也有将近一年的时间.这一年以来也接触过了很具代表性 ...
- 小伙伴想学Jenkins自动构建发布项目，我：安排上了！！
写在前面 趁着十一长假,很多小伙伴都在悄悄学习,有些是为了能够顺利通过面试,进入大厂升职加薪.有些则是为了进一步巩固和提高自己的专业技能,希望有朝一日能过成为互联网架构师乃至技术专家.这不,就有小伙伴 ...
- 引用类型之Array(一)
Array类型 除了Object之外,Array类型在ECMAScript中也很常用.ECMAScript中的数组与其他多数语言中的数组有着相当大的区别.ECMAScript数组的每一项可以保存任何类 ...