html客户端存储技术
LocalStorage:
<!html>
<html>
<head>
<meta charset="utf-8">
<script>
function saveLocalStorage(){
var name = document.getElementById("name").value;
localStorage.name = name;
}
function showLocalStorage(){
var name = localStorage.name;
document.getElementById("showName").innerText = name;
}
</script>
</head>
<body>
<div>storage</div>
<div>
用户名:<input type="text" id="name">
<button type="button" οnclick="saveLocalStorage();">localStorage</button>
</div>
<div>
<div id="showName"></div>
<button type="button" οnclick="showLocalStorage();">showLocalStorage</button>
</div>
</body>
</html>
SessionStorage:
<!html>
<html>
<head>
<meta charset="utf-8"/>
<script>
function saveSessionStorage(){
var name = document.getElementById("name").value;
sessionStorage.name = name;
}
function showSessionStorage(){
var name = sessionStorage.name;
document.getElementById("showName").innerText = name;
}
</script>
</head>
<body>
<div>storage</div>
<div>
用户名:<input type="text" id="name">
<button type="button" οnclick="saveSessionStorage();">sessionStorage</button>
</div>
<div>
<div id="showName"></div>
<button type="button" οnclick="showSessionStorage();">showSessionStorage</button>
</div>
</body>
</html>
html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就无能为力了,灵活大不够强大。我们经常在数据库中处理大量结构化数据,html5引入Web SQL Database概念,它使用 SQL 来操纵客户端数据库的 API,这些 API 是异步的,规范中使用的方言是SQLlite。这个文档曾经在W3C推荐规范上,但规范工作已经停止了
IndexedDB详见下面的博文
http://blog.youkuaiyun.com/mynewdays/article/details/50317595