制作留言板主要的用到三個函數(shù)
savaStorage函數(shù)
loadStorage函數(shù)
clearStorage函數(shù)
new Date().getTime()---獲取時間
localStorage.setItem---時間為鍵值 數(shù)據(jù)為鍵名
loadStorage---保存數(shù)據(jù)
loadStorage.length---數(shù)據(jù)長度
localStorage.key(index)
localStorage.clear();---清除數(shù)據(jù)
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>制作簡單的留言板</title>
<script type="text/javascript" src="制作簡單的留言板.js"></script>
</head>
<body>
<h1>杰哥留言板</h1>
<textarea id="dome" cols="60"rows="10"></textarea><br/>
<input type="button" value="保存" onclick="savaStorage('dome');">
<input type="button" value="刪除" onclick="clearStorage('msg')";>
<input type="button" value="讀取" onclick="loadStorage('msg')";><hr/>
<p id="msg"></p>
</body>
</html>
javascript:
function savaStorage(id) {
var data=document.getElementById(id).value;
var time=new Date().getTime();
localStorage.setItem(time,data);
alert("數(shù)據(jù)保存成功！");
loadStorage('msg');
}
function loadStorage(id) {
var result='<table border="1"><tr><td>'+'條數(shù)'+'</td><td>'+'值'+'</td><td>'+'中國時間'+'</td></tr>';
for(var i=1;i<localStorage.length+1;i++){
var key=localStorage.key(i);//數(shù)據(jù)條數(shù)
var value=localStorage.getItem(key);//內(nèi)容
var date=new Date();//時間值
date.setTime(key);//中國時間 跟隨變化
//var datestr=date.toGMTString(); //格林尼治時間
result+='<tr><td>'+'第'+i+'條'+'</td><td>'+value+'</td><td>'+date+'</td></tr>'
}
result+='</table>';
var target=document.getElementById(id);
target.innerHTML=result;
}
function clearStorage(id) {
localStorage.clear();
alert("數(shù)據(jù)全部清除！");
}
本站僅提供存儲服務(wù)，所有內(nèi)容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請
點擊舉報。
