webstorage 分sessionStorage和localstorage,sessionStorage是暂时保存,localStorage是永久保存。 sessionStorage假设浏览器关闭了,数据就没有了。而localStorage则不会。
sessionStorage:
保存数据 sessionStorage.setItem(key, value);
读取数据 sessionStorage.getItem(key);
localStorage:
保存数据 localStorage.setItem(key, value);
读取数据 localStorage.getItem(key);
演示样例
<span style="font-family:Microsoft YaHei;font-size:18px;"><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script language="JavaScript"> function saveStorage(id){ var target = document.getElementById(id); var str = target.value; sessionStorage.setItem("msg", str); } function loadStorage(id){ var target = document.getElementById(id); var msg = sessionStorage.getItem("msg"); target.innerHTML = msg; } </script> </head> <body> <p id="msg"></p> <input type="text" id="input"/> <button onclick="saveStorage('input')">保存数据</button> <button onclick="loadStorage('msg')">获取数据</button> </body> </html></span>
假设使用得好,也可将webStorage作为一个简易的数据库,键的值採用JSON字符串就能够。当然这仅仅是能够实现,运用的时候,webStorage的空间还是非常珍贵的。一般大多数浏览器都仅仅提供5M左右的空间。