var referurl = document.referrer; //上级网址
if(referurl.indexOf('address_order')>0){ //判断是否是从上一级地址跳转过来到当前页面的
sessionStorage.setItem('associationreferurl',referurl);
//保存到sessionStorage;字符串的形式存储
}

简单设置和获取sessionStorage:

获取sessionStorage的值:

sessionStorage.getItem('associationreferurl');

sessionStorage / localStorage

setItem存储value
用途:将value存储到key字段
用法:.setItem( key, value)
代码示例:

sessionStorage.setItem("key", "value"); 
localStorage.setItem("site", "js8.in");

getItem获取value
用途:获取指定key本地存储的值
用法:.getItem(key)
代码示例:

var value = sessionStorage.getItem("key"); 
var site = localStorage.getItem("site");

removeItem删除key
用途:删除指定key本地存储的值
用法:.removeItem(key)
代码示例:

sessionStorage.removeItem("key"); 
localStorage.removeItem("site");

clear清除所有的key/value

用途:清除所有的key/value
用法:.clear()
代码示例:

sessionStorage.clear(); 
localStorage.clear();

其他操作方法:点操作和[]
web Storage不但可以用自身的setItem,getItem等方便存取,也可以像普通对象一样用点(.)操作符,及[]的方式进行数据存储,像如下的代码:

var storage = window.localStorage;
storage.key1 = "hello";
storage["key2"] = "world";
console.log(storage.key1);
console.log(storage["key2"]);

localStorage和sessionStorage的key和length属性实现遍历

sessionStorage和localStorage提供的key()和length可以方便的实现存储的数据遍历,例如下面的代码:

var storage = window.localStorage;
for (var i=0, len = storage.length; i < len; i++){
  var key = storage.key(i);
  var value = storage.getItem(key);
  console.log(key + "=" + value);
}

sessionStorage / localStorage的更多相关文章

  1. sessionStorage & localStorage & cookie

    sessionStorage & localStorage & cookie 概念 html5中的Web Storage包括了两种存储方式:sessionStorage和localSt ...

  2. session,cookie,sessionStorage,localStorage的区别及应用场景

    session,cookie,sessionStorage,localStorage的区别及应用场景 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟 ...

  3. 缓存session,cookie,sessionStorage,localStorage的区别

    https://www.cnblogs.com/cencenyue/p/7604651.html(copy) 浅谈session,cookie,sessionStorage,localStorage的 ...

  4. sessionStorage & localStorage in-depth

    sessionStorage & localStorage in-depth Web Storage API https://developer.mozilla.org/en-US/docs/ ...

  5. H5的storage(sessionstorage&localStorage)简单存储删除

    众所周知,H5的storage有sessionstorage&localStorage,其中他们的共同特点是API相同 下面直接上代码,storage中的存储与删除: <!DOCTYPE ...

  6. 彻底弄清楚session,cookie,sessionStorage,localStorage的区别及应用场景(面试向)

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_94 客户端状态保持是一个老生常谈的问题了,归根结底追踪浏览器的用户身份及其相关数据无非就是以下四种方式:session,cooki ...

  7. cookie sessionStorage localStorage 区别

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务器间不必 ...

  8. 本地存储(cookie&sessionStorage&localStorage)

    好文章,最全面.就查它吧:https://segmentfault.com/a/1190000004556040 1.DOM存储:https://developer.mozilla.org/zh-CN ...

  9. 数据存储之Web存储(sessionStorage localStorage globalStorage )

    Web Storage 两个目标 提供一种在cookie之外的存储会话守数据的途径 提供一种存储大量可以跨会话存在的数据机制 最初的Web Storage规范包含两个对象 sessionStorage ...

随机推荐

  1. Linux单机安转Spark

    安装Spark需要先安装jdk及安装Scala. 1. 创建目录 > mkdir  /opt/spark > cd  /opt/spark 2. 解压缩.创建软连接 > tar  z ...

  2. 通过hover修改其他元素

    hover,我们都知道,是监听组件“悬停状态”的一个伪类. 我们一般通过hover来修改组件的背景什么的,很少涉及到太复杂的操作.也就是说我们一般只是对加了hover伪类的元素自身的样式进行改变,比如 ...

  3. WCF使用小例子

    using System.Runtime.Serialization; using System.ServiceModel; using MySpace; using System.ServiceMo ...

  4. python每日一类(1):pathlib

    每天学习一个python的类(大多数都是第三方的),聚沙成金. -------------------------------------------------------------------- ...

  5. Matlab,C++存取二进制

    1,Matlab存储二进制 load Wall.dat %读取数据,数组名为Wall fid=fopen('Wall','wb'); %打开一个文件,二进制写入 fwrite(fid,Wall','f ...

  6. virtualbox centos6.6 minimal 与宿主机win7共享文件夹

    1.virtualbox, 设置-共享文件夹,设置好共享文件夹win7dir 2.centos 创建文件夹比如share 3.mount -t vboxsf win7dir /root/share 4 ...

  7. ZOJ 3949 (17th 浙大校赛 B题,树型DP)

    题目链接  The 17th Zhejiang University Programming Contest Problem B 题意  给定一棵树,现在要加一条连接$1$(根结点)和$x$的边,求加 ...

  8. java copy array

    13down voteaccepted Here's a java 1.4 compatible 1.5-liner: int[] array = { 1, 2, 3, 4, 5 }; int siz ...

  9. 八. 输入输出(IO)操作1.输入输出基本概念

    输入输出(I/O)是指程序与外部设备或其他计算机进行交互的操作.几乎所有的程序都具有输入与输出操作,如从键盘上读取数据,从本地或网络上的文件读取数据或写入数据等.通过输入和输出操作可以从外界接收信息, ...

  10. 弱电系统标准CAD图例识图讲解

    弱电系统标准CAD图例识图讲解 http://www.360doc.com/content/17/0317/16/33642774_637680009.shtml