注意:
localStorage只能存储字符串,要存储json就要用JSON.stringify()与JSON.parse()相互转化了。
localStorage的一些使用方法:
1. localStorage就是个json,只是key对应的value只能是字符串而已,其它操作与json相同。
2. localStorage清除所有值的方法:
localStorage.clear()
JSON.stringify() 把json转化成json字符串 括号中是要转化的json
JSON.parse() 把json字符串转化成json 括号中是要转化的json字符串
下面是一个简单的事例
只要不清楚浏览器缓存,数据就不会丢失
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>H5本地存储数据</title>
<script src="jquery.min.js"></script>
</head>
<body>
<div class="box">
<input class="ipt" type="text">
<button class="btn">提交</button>
</div>
</body>
<script>
$(function(){
function localData() {
var data;
// 从localStorage中获取数据
// var mda = localStorage.moneyData;
if (localStorage.moneyData) {
data = JSON.parse(localStorage.moneyData);
}else{
data = new Array();
};
function creat(){
if (data.length>0) {
var ul = $('<ul>');
for (var i = 0; i < data.length; i++) {
var li = $('<li>');
li.text(data[i]);
ul.append(li);
};
$('.box').children('ul').remove();
$('.box').append(ul);
};
};
creat();
$('.btn').click(function(){
var txt = $('.ipt').val();
$('.ipt').val('');
if (!txt) return false;
data.push(txt);
creat();
// 存储数据
var lda = JSON.stringify(data);
localStorage.moneyData = lda;
console.log(localStorage);
});
};
localData();
})
</script>
</html>