Html5 Web的5中离线存储方式之localStorage
Html5 Web的5中离线存储方式之localStorage
在HTML5越来越流行的今天,如果你还不知道离线存储,那就说明你落后了很多。
HTML5的离线存储方式有多种:Web SQL Database、LocalStorage、Cookie、WebStorage、IndexedDB、FileSystem。
Web SQL Database目前虽然还有浏览器支持,是唯一的关系数据库结构的存储,但W3C以及停止对其的维护和发展。我就不多说了。
今天我们主要看LocalStorage这种最简单的本地存储方式。
先来看一个小例子
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5中LocalStorage的使用</title>
</head>
<body>
<p>
你浏览当前页面
<span id="count">N</span>
次.
</p>
<script>
if (!localStorage.pageLoadCount)
localStorage.pageLoadCount = 0;
localStorage.pageLoadCount = parseInt(localStorage.pageLoadCount) + 1;
document.getElementById(‘count‘).textContent = localStorage.pageLoadCount;
</script>
</body>
</html>
看看运行效果
/**
* 保存/更新数据
*/
function saveDm(dataModel){
window.localStorage[‘DataModel‘] = dataModel;
}
/**
* 获取数据
*/
function getDm(){
var value = window.localStorage[‘DataModel‘];
if(value){
return value;
}
return ‘‘;
}
/**
* 删除数据
*/
function clearDm(){
if(window.localStorage[‘DataModel‘]){
delete window.localStorage[‘DataModel‘];
}
}
欢迎大家关注我的博客!如有疑问,请加QQ群:135430763共同学习!
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。