h5-localStorage储存的使用
<!--
localStorage的使用:
1.存储的内容大概20mb
2.不同浏览器不能共享数据,但是在同意浏览器的不同窗口中可以共享数据
3.永久生效,他的数据是储存在硬盘上,并不会随着页面或者浏览器的关闭而清除,如果想清除必须手动清除 setTtem(key,value):存储数据,以键值对的方式储存
getItem(key):获取数据,通过制定名称的key获取对应的value值
removeItme(key):删除数据,通过制定名称key删除对应的值
clear():清空所有存储的内容
-->
<input type="text" id="username"><br/>
<input type="button" value="设置数据" id="setData"><br/>
<input type="button" value="获取数据" id="getData"><br/>
<input type="button" value="删除数据" id="removeData"><br/> <script>
/*存储数据*/
document.querySelector("#setData").onclick=function () {
var name = document.querySelector("#username").value;
window.localStorage.setItem("userName",name);
}
/*获取数据*/
document.querySelector("#getData").onclick=function () {
/*如果找不到对应名称的key,那么就会获取null*/
var name=window.localStorage.getItem("userName");
alert(name);
}
/*删除数据*/
document.querySelector("#removeData").onclick=function () {
/*在删除的时候如果key值错误,不会报错,也不会删除数据*/
window.localStorage.removeItem("userName");
}
</script>
h5-localStorage储存的使用的更多相关文章
- H5本地储存Web Storage
一.本地存储由来的背景 由于HTML4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是Cookie的这些限制,也就导致了C ...
- 解析H5本地储存Web Storage
一.本地存储由来的背景 由于HTML4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是Cookie的这些限制,也就导致了C ...
- 利用 localStorage 储存css js
链接 版本号, 可以后台输出到jsp页面上 移动端webapp值得一试: 兼容性好 网速慢,LS读取+eval大多数情况下快于304 webapp不需要seo,css也可以缓存,再通过js加载 浏览 ...
- H5 localStorage入门
定义 只读的 localStorage 允许你访问一个 Document 的远端(origin)对象 Storage:数据存储为跨浏览器会话.localStorage 类似于 sessionStora ...
- HTML5 ---localStorage储存实例
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title> ...
- h5 localStorage存储大小(转)
摘要 HTML5 的本地存储 API 中的 localStorage 与 sessionStorage 在使用方法上是相同的,区别在于 sessionStorage 在关闭页面后即被清空,而 loca ...
- H5 localStorage sessionStorage
localStorage 用于长久保存整个网站的数据,没有过期时间,除非手动去除. sessionStorage 会话存储,临时存储,当用户关闭浏览器窗口后,数据被删除. 共同方法 以 localSt ...
- html5:localStorage储存
实例:刷新值会增长,关掉浏览器,再打开,值会在原基础上增长 if(localStorage.pagecount){ localStorage.pagecount=Number(localStorage ...
- h5 localStorage本地存储
用户名:<input type="text" id="txtname"/> 密码:<input type="text" i ...
- h5 localStorage和sessionStorage浏览器数据缓存
sessionStorage 会话数据,localStorage 没有过期时间 两个的API基本都一样的 基本的使用 // 保存一个数据 sessionStorage.setItem('key', ' ...
随机推荐
- Arduino nano的bootloader文件烧录
1.买了了nano还没用就用 avrisp烧录器给烧了其他程序,仅仅是的avr单片机了:2.将他恢复成Arduino nano吧. 在Arduino软件安装目录中的hardware\arduino中. ...
- JQuery 多属性选择节点
JQuery 1.6.0+以后用prop()代替attr(); 多属性选择节点 $("input[type=checkbox][name='first2'][value='first4']& ...
- mfc 选择文件(可多选)
CFileDialog dlg( TRUE, NULL, NULL, OFN_ALLOWMULTISELECT, NULL, NULL ); DWORD MAXFILE = ; //2562 is t ...
- 【LeetCode】课程表
[问题]现在你总共有 n 门课需要选,记为 0 到 n-1. 在选修某些课程之前需要一些先修课程.例如,想要学习课程 0 ,你需要先完成课程 1 ,我们用一个匹配来表示他们: [0,1] 给定课程总量 ...
- oracle常用密令大全
1.create user username identified by password;//建用户名和密码oracle ,oracle 2.grant connect,resource,dba t ...
- SASS - @extend(继承)指令
SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – 语法 SASS – 变量 SASS- 局部文件(Partial) SASS – 混合(Mixin) SASS ...
- SASS - 语法
SASS – 简介 SASS – 环境搭建 SASS – 使用Sass程序 SASS – 语法 SASS – 变量 SASS- 局部文件(Partial) SASS – 混合(Mixin) SASS ...
- VS.NET中的常用控件和类型的命名规范
表1 命名规范 VS名称 简写 VS名称 简写 数据类型 Array arr Boolean bln Byte byt Char Chr Date Time dtm Decimal dtm Doub ...
- DRF项目之解决浏览器同源策略问题
DRF项目,是一个前后端分离的Web框架. 本项目中,我们前端采用的是VUE框架. 前后端分离的情况就会出现一个问题,前端的Ajax请求无法请求到后端API(接口). 那么,为什么会出现这种问题呢? ...
- Python中Opencv和PIL.Image读取图片的差异对比
近日,在进行深度学习进行推理的时候,发现不管怎么样都得不出正确的结果,再仔细和正确的代码进行对比了后发现原来是Python中不同的库读取的图片数组是有差异的. image = np.array(Ima ...