标签：
web存储有很多种，具体的运用要看具体的情况。
我们先来看第一种：
这是html代码
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>sessionStorage</title> </head> <body> <label for="in1">键值名</label><input type="text" id="in1"/> <label for="in2">键值</label><input type="text" id="in2"/> <label for="in3">删除指定键</label><input type="text" id="in3"/> <button onclick="fun1()">add_sessionStorage</button> <button onclick="fun2()">show_sessionStorage</button> <button onclick="fun3()">clear_sessionStorage</button> <br/> <a href="test.html">go_test</a> </body> </html>
可以看到在代码中，有3个按钮分别有着3个不同的功能，先看第一个，增加操作：
function fun1(){ console.log(sessionStorage); // 用于将数据存放在我们的sessionStorage中 var name1=document.getElementById("in1").value; var name2=document.getElementById("in2").value; sessionStorage.setItem(name1,name2); console.log(sessionStorage); }
其中sessionStorage便是我们存储数据的地方。用sessionStrorage.setItem(name1,name2);的方法可以把我们想要存储的数据以键值对的形式存储在我们的浏览器当中，name1是键值名，name2是值。
然后看第二个：
function fun2(){ // 用于取得sessionStorage中的数据 console.log(sessionStorage); // 方法二 var infor1=sessionStorage.hehe2; // 方法一 var strt="hehe2" var infor2=sessionStorage.getItem(strt); alert(infor2); // 取得sessionStorage中的键值名 var k_name=sessionStorage.key(0) console.log(‘键值名为‘+k_name); }
这段代码用来获取我们之前存储的数据。
然后第三段：
function fun3(){ // 用于清除sessionStorage中的数据 // console.log(sessionStorage); // sessionStorage.clear(); // console.log(sessionStorage); // sessionStorage.clear(); var name1=document.getElementById("in3").value; //删除指定的键值名的数据 sessionStorage.removeItem(name1); console.log(sessionStorage); document.getElementById("in1").value=""; document.getElementById("in2").value=""; }
这段代码用于删除存储的数据。
以上用到的sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。
还有一个叫做localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。
标签：
原文地址：http://www.cnblogs.com/dongchaoge/p/4581998.html
