HTML5数据存储---使用clear()方法清除localStorage保存对象的全部数据

xiaoxiao2021-02-28  33

<!doctype html> <html> <head> <meta charset="utf-8"> <title>清空localStorage的全部数据</title> </head>

<body> <fieldset> <input type="button" id="btnadd" onClick="add_click()" value="增加数据"> <input type="button" id="btndel" onClick="del_click()" value="清除数据"> <p id="pstauts"></p> </fieldset> </body> <script type="text/javascript" > function $(id){ return document.getElementById(id);  } var intNum = 0; //保存数据函数 function add_click(){ for(var intI = 0;intI <= 5;intI++){ var strKeyName = "strKeyName"+intI; var strKeyValue = "strKeyValue"+intI;  localStorage.setItem(strKeyName,strKeyValue); intNum++; }  $("pstauts").style.display = "block";  $("pstauts").innerHTML = "已保存成功<br>"+intNum+"<br>条记录" } //清空数据函数 function del_click(){  localStorage.clear();  $("pstauts").style.display = "block";  $("pstauts").innerHTML = "全部数据已经清除" } /* 代码解析: 当用户点击"增加数据",将使用循环的方式,按执行顺序保存6条数据记录 其键名"strKeyName"与变量intI相连,其值名"strKeyValue"也与intI相连,这些数据 被localStorage对象保存记录,可以再浏览器Chrome中通过单击右键,选择"审查元素"选项, 单击"Resources"选项查看localStorage保存的数据 当用户"点击清除数据"将清空localStorage对象保存数据记录 */

</script> </html>

转载请注明原文地址: https://www.6miu.com/read-1450080.html

最新回复(0)