您的位置：首页 > Web前端 > HTML5

h5-26-web本地存储

2017-08-03 10:08 555 查看 
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="button" value="返回个数" onclick="getLen()" />
<input type="button" value="增加" onclick="add();" />
<input type="button" value="修改" onclick="update();" />
<input type="button" value="删除" onclick="del();" />
<input type="button" value="返回value" onclick="get();" />
<input type="button" value="返回key" onclick="getKey();" />
<input type="button" value="清空" onclick="delAll();" />

<script>
var i = localStorage.length; //计数变量

//返回web存储的键值对的个数
function getLen() {
alert(localStorage.length);
}

//设置键值对
function add() {
localStorage.setItem('username' + i,'jack' + i);
i ++;
alert('存储成功');
}

//修改键值对
function update() {
localStorage.setItem('username2','李四');
alert('修改成功');
}

//删除键值对
function del() {
localStorage.removeItem('username2');
alert('删除成功');
}

//返回键对应的值
function get() {
var result = localStorage.getItem('username3');
alert(result);
}

//通过下标，返回key
function getKey() {
var key = localStorage.key(3);
alert(key);
}

//删除所有数据
function delAll() {
localStorage.clear();
alert('数据被清空');
}
</script>
</body>
</html>


　　
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航