h5-sessionStorage储存的使用
<!--
sessionStorage的使用:存储数据到本地。存储的容量5mb左右
1.这个数据本质是储存在当前页面的内存中
2.他的生命周期为关闭当前页面,关闭页面,数据会自动清楚 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.sessionStorage.setItem("userName",name);
}
/*获取数据*/
document.querySelector("#getData").onclick=function () {
/*如果找不到对应名称的key,那么就会获取null*/
var name=window.sessionStorage.getItem("userName");
alert(name);
}
/*删除数据*/
document.querySelector("#removeData").onclick=function () {
/*在删除的时候如果key值错误,不会报错,也不会删除数据*/
window.sessionStorage.removeItem("userName");
}
</script>
h5-sessionStorage储存的使用的更多相关文章
- H5本地储存Web Storage
一.本地存储由来的背景 由于HTML4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是Cookie的这些限制,也就导致了C ...
- 解析H5本地储存Web Storage
一.本地存储由来的背景 由于HTML4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是Cookie的这些限制,也就导致了C ...
- sessionStorage 退出登录删除sessionStorage储存
1 登录后在sessionStorage中添加token的值,退出后清空 登录后在sessionStorage中添加token的值,退出后清空 localStorage 和 sessionStorag ...
- html5 说明
# 客户端储存历程 远古时期 cookies的用法和缺陷 userdata HTML5时代 localstorage application cache 离线缓存 indexedeDB 客户端数据 ...
- JQuery中的表单验证及相关的内容
前 言 JRedu Android应用开发中,经常要用到表单.既然用到了表单,那就不可避免的要用到表单的验证.但是,在提交表单时,但是,并不是,每次提交的表单内容都是正确的,如果 每次都将表单的 ...
- HTML5 的web储存: localStorage & sessionStorage
早期的浏览器使用cookie储存,HTML5新增web储存,包括:localStorage 和 sessiongStorage; localStorage:可以永久储存: sessionStorage ...
- 关于H5本部缓存localStorage,sessionStorage
HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 coo ...
- 3分钟学会sessionStorage用法(h5页面返回滚动到上次浏览器位置)
前言: 因最近移动端开发过程中遇到一个运营提出的所谓技术难点需求,对于原生APP来说轻而易举,毕竟自己的APP用户操作指哪打哪,但是H5该怎么做?H5就实现不了么?对于一个爱研究攻克这些前端棘手问题的 ...
- 浏览器本地储存方式有哪些?cookie、localStorage、sessionStorage
现阶段,浏览器提供的储存方式常用的有三种,cookie.localStorage.sessionStorage 1.cookie 概念:cookie 是浏览器中用于保存少量信息的一个对象 基本特征: ...
- h5的localStorage和sessionStorage
今天做了个首页的弹窗,要求是打开时显示弹窗,然后点击关闭按钮时弹窗关闭,然后点击不再显示,之后再刷新就不会有弹窗,总结一下需求. 1.弹窗显示隐藏 这个很容易,我们可以用display:none和di ...
随机推荐
- POJ 3321:Apple Tree 树状数组
Apple Tree Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 22131 Accepted: 6715 Descr ...
- (1)关于PSP寄存器和MSP寄存器的简单描述
由于 Cortex-M3 和 M4 内核具有双堆栈指针, MSP 主堆栈指针和 PSP 进程堆栈指针,或者叫 PSP任务堆栈指针也是可以的.在 FreeRTOS 操作系统中,主堆栈指针 MSP 是给系 ...
- jQuery判断输入法和非输入法输入
需求背景: 页面需要输入完成后自动查询. 解决方案: $('input').on('input', function() { if ($(this).prop('comStart')) return; ...
- 学术Essay写作如何体现逻辑的应用
作为一篇学术essay,逻辑要求是必不可少的.那么,学术essay如何写作才能体现逻辑呢?这就需要从语言逻辑和科学逻辑出发. 语言逻辑指的是三C原则:(1)complete(完整),(2)concis ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 字体图标(Glyphicons):glyphicon glyphicon-facetime-video
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- AI 人工智能产业园路口-----dp
北京市商汤科技开发有限公司建立了新的 AI 人工智能产业园,这个产业园区里有 nn 个路口,由 n - 1n−1 条道路连通.第 ii 条道路连接路口 u_iui 和 v_ivi. 每个路口都布有 ...
- vant库在vue全局引入toast组件
第一步: 在config中引入 // 全局引入vant的提示框 import { Toast } from "vant"; Vue.use(Toast); 第二步: 在组要的.vu ...
- CentOS 7 下oracle 11G R2 ADG 搭建
本文记录ADG搭建操作步骤,首先在虚拟机CentOS中安装并配置好oracle 11g R2(具体安装步骤在我的另一篇博客中),然后拷贝一份虚拟机,修改新虚拟机的主机名和ip配置,这时候主库和备库是一 ...
- cf 766#
天呢,太垃圾了我.. AB懵逼了半天题意,C最后搞了个DP还不对...DP太垃圾了,, #include<bits/stdc++.h> #define INF 0x7fffffff #de ...
- Java8大排序算法
一.冒泡排序 基本思想:通过对待排序序列此前向后,依次比较相邻元素的值,若发现逆序则进行交换,使得较大的值从前面移动到后面, 类似于水下的气泡一样(是所有排序算法中效率最低的) publi ...