Html使用localStorage存储,读取,删除数据
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus?">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
<div id="msg"></div>
<input type="text" id="msgtxt"/>
<button id="savemsg" onclick="savemsg("msgtxt")">保存</button>
<button id="showmsg" onClick="showmsg("msg")">显示</button>
<button id="removeBtn" onClick="removeKey("key")">删除</button>
</body>
<script>
function savemsg(id){
var savemsg = document.getElementById(id);
var msg=savemsg.value;
for(var i=0;i<100;i++)
{
// 循环存储值,并动态添加键值对
localStorage.setItem("message"+i,msg+"-"+i);
}
}
function showmsg(id){
// 显示数据到 Div
var showmsg= document.getElementById(id);
for(var i=0;i<100;i++)
{
showmsg.innerHTML+=localStorage.getItem("message"+i) + " ";
}
}
function removeKey(key){
for(var i=0;i<100;i++)
{
// 查找键值对删除
localStorage.removeItem("message"+i);
}
//localStorage.clear(); 删除所有
}
</script>
</html>
效果图:
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。
- 上一篇: php如何判断数字是几位数
- 下一篇: php导出数据到excel, 防止0开头的数字掉失
