WebStorage

来源：互联网发布：乐视手机mac拨号编辑：程序博客网时间：2024/05/16 07:00

1. sessionStorage  只能保存从浏览页面开始到关闭浏览器期间所要保存的所有数据。

<head>    <meta charset="UTF-8">    <title>Title</title>    <script src="web01-1.js"></script></head><body><p id="msg"> </p><input type="text" id="input"><input type="button" value="保存数据" onclick="saveStorage('input')"><input type="button" value="读取数据" onclick="loadStorage('msg') "></body>

function saveStorage(id) {    var target=document.getElementById(id);    var str=target.value;    sessionStorage.setItem("message",str);    alert("保存成功！");}function loadStorage(id) {    var target=document.getElementById(id);    var msg=sessionStorage.getItem("message");    target.innerHTML=msg;}
2. localStorage   将数据保存在客户端本地硬件设备中，即使浏览器被关闭了，数据依然存在。

function saveStorage(id) {    var target=document.getElementById(id);    var str=target.value;    localStorage.setItem("message",str);    alert("保存成功！");}function loadStorage(id) {    var target=document.getElementById(id);    var msg=localStorage.getItem("message");    target.innerHTML=msg;}

3.简单web留言本

<head>    <meta charset="UTF-8">    <title>Title</title>    <script src="web02.js"></script></head><body><p id="msg"></p><textarea id="memo" cols="60" rows="10"></textarea>  <br/><input type="button" value="追加数据" onclick="saveStorage('memo')"><input type="button" value="删除数据" onclick="clearStorage() "></body>

function saveStorage(id) {    var data=document.getElementById(id).value;    var time=new Date().getTime();    localStorage.setItem("time",data);    alert("保存成功！");    loadStorage("msg");}function loadStorage(id) {    var result="<table border='1'>";    for(var i=0;i<localStorage.length;i++){        var key=localStorage.key(i);        var value=localStorage.getItem(key);        var date=new Date();        date.getTime(key);        result +="<tr><td>"+value+"</td><td>"+date+"</td></tr>";    }    result +="</table>";    var target=document.getElementById(id);    target.innerHTML=result;}function clearStorage() {    localStorage.clear();    alert("数据已经删除！");    loadStorage('msg');}

0 0