<!--
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储存的使用的更多相关文章

  1. H5本地储存Web Storage

    一.本地存储由来的背景 由于HTML4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是Cookie的这些限制,也就导致了C ...

  2. 解析H5本地储存Web Storage

    一.本地存储由来的背景 由于HTML4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是Cookie的这些限制,也就导致了C ...

  3. sessionStorage 退出登录删除sessionStorage储存

    1 登录后在sessionStorage中添加token的值,退出后清空 登录后在sessionStorage中添加token的值,退出后清空 localStorage 和 sessionStorag ...

  4. html5 说明

    # 客户端储存历程 远古时期 cookies的用法和缺陷 userdata   HTML5时代 localstorage application cache 离线缓存 indexedeDB 客户端数据 ...

  5. JQuery中的表单验证及相关的内容

      前  言 JRedu Android应用开发中,经常要用到表单.既然用到了表单,那就不可避免的要用到表单的验证.但是,在提交表单时,但是,并不是,每次提交的表单内容都是正确的,如果 每次都将表单的 ...

  6. HTML5 的web储存: localStorage & sessionStorage

    早期的浏览器使用cookie储存,HTML5新增web储存,包括:localStorage 和 sessiongStorage; localStorage:可以永久储存: sessionStorage ...

  7. 关于H5本部缓存localStorage,sessionStorage

    HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 coo ...

  8. 3分钟学会sessionStorage用法(h5页面返回滚动到上次浏览器位置)

    前言: 因最近移动端开发过程中遇到一个运营提出的所谓技术难点需求,对于原生APP来说轻而易举,毕竟自己的APP用户操作指哪打哪,但是H5该怎么做?H5就实现不了么?对于一个爱研究攻克这些前端棘手问题的 ...

  9. 浏览器本地储存方式有哪些?cookie、localStorage、sessionStorage

    现阶段,浏览器提供的储存方式常用的有三种,cookie.localStorage.sessionStorage 1.cookie 概念:cookie 是浏览器中用于保存少量信息的一个对象 基本特征: ...

  10. h5的localStorage和sessionStorage

    今天做了个首页的弹窗,要求是打开时显示弹窗,然后点击关闭按钮时弹窗关闭,然后点击不再显示,之后再刷新就不会有弹窗,总结一下需求. 1.弹窗显示隐藏 这个很容易,我们可以用display:none和di ...

随机推荐

  1. 小程序填坑:2018最新getPhoneNumber功能详解

    本篇博客主要详解getPhoneNumber组件的功能,填补网上那些到处是漏洞的博客.加上小程序官方本身也是满满的漏洞. 惯例先上总纲: ##主要内容 1.前端页面组件书写 2.JS内组件用法 3.接 ...

  2. 12.Python的高级语法和用法

    # from enum import Enum # 枚举 # class VIP(Enum): # YELLOW = # YELLOW_ALIAS = # 别名 # GREEN = # BLACK = ...

  3. 《新标准C++程序设计》3.9-3.10(C++学习笔记11)

    一.C++程序到C程序的翻译 程序示例分析: C++: class CCar { public: int price; void SetPrice (int p); }; void CCar::Set ...

  4. 如何让手游更省带宽,耗电量更少?TBR渲染架构解析!

    如何让手游更省带宽,耗电量更少?渲染或是其中一个可突破的点.本文中,腾讯游戏学院专家Hailong将从为大家解析TBR渲染架构的特点. 什么是TBR? 全称是Tile Based Rendering, ...

  5. UVALive 4287 SCC-Tarjan 加边变成强连通分量

    还是强连通分量的题目,但是这个题目不同的在于,问你最少要添加多少条有向边,使得整个图变成一个强连通分量 然后结论是,找到那些入度为0的点的数目 和 出度为0的点的数目,取其最大值即可,怎么证明嘛... ...

  6. oracle获取排序第一的数据

    一:按照某字段排序(时间,总数等),获取第一条 select a.* FROM ( select * from ( select t.*,row_number() over(partition by ...

  7. 【剑指Offer】面试题10- II. 青蛙跳台阶问题

    题目 一只青蛙一次可以跳上1级台阶,也可以跳上2级台阶.求该青蛙跳上一个 n 级的台阶总共有多少种跳法. 答案需要取模 1e9+7(1000000007),如计算初始结果为:1000000008,请返 ...

  8. SpringBoot+SpringSecurity之多模块用户认证授权同步

    在之前的文章里介绍了SpringBoot和SpringSecurity如何继承.之后我们需要考虑另外一个问题:当前微服务化也已经是大型网站的趋势,当我们的项目采用微服务化架构时,往往会出现如下情况: ...

  9. maven工程运行演示

    通过maven提供的命令来运行maven工程,体会maven构建工程的优点. (1)运行web工程    进入maven工程目录(当前目录有pom.xml),运行tomcat:run命令 可能出现的问 ...

  10. CSS3 之高级动画(6)CSS3 clip-path属性实现的几何图形变形动画

    clip-path 属性介绍: clip-path属性可以创建一个只有元素的部分区域可以显示的剪切区域. 区域内的部分显示,区域外的隐藏. 剪切区域是被引用内嵌的URL定义的路径或者外部svg的路径. ...