Web Storage可以保存数据在客户端本地，以key-value的形式存储，长久存储数据需要用到localStorage,短期保存可以使用sessionStorage.
代码截图：
源代码：
index.html
<head>
<script src="app.js"></script>
</head>
<body>
<p id="id_p"></p>
<textarea id="id_textInput" cols="20" rows="10"></textarea><br />
<input type="button" value="保存留言" οnclick="saveData('id_textInput', 'id_p')" />
<input type="button" value="显示留言" οnclick="showData('id_p')" />
<input type="button" value="清空" οnclick="clearData('id_p')" />
</body>
app.js
function saveData(id, id_show){
var target = document.getElementById(id);
var str = target.value; // 获得输入的文本内容
var time = new Date().getTime();
localStorage.setItem(time, str);
alert("存储成功!");
showData(id_show);
}
function showData(id_show){
var target = document.getElementById(id_show);
var str = "<table border='1' cellspacing='0'><tr><th>Key</th><th>Value</th></tr>";
for(var i = 0; i < localStorage.length; i++)
{
var key = localStorage.key(i);
var val = localStorage.getItem(key);
str += "<tr><th>" + key +"</th><th>" + val + "</th></tr>";
}
str += "</table>";
target.innerHTML = str;
// target.innerText = str;
}
function clearData(id_show)
{
localStorage.clear();
alert("清空数据!");
showData(id_show);
}
效果图：
876
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
