html,css,js,简单的网页留言板

效果如图：

实现代码如下：

html代码：

简单的网页留言板

---

 

index.js代码：

///**
// * Created by Administrator on 2014/11/27.
// */
//function saveStorage(id){
// var data = document.getElementById(id).value;
// var time = new Date().getTime();
// localStorage.setItem(time,data);
// alert("数据已经被保存！");
// loadStorage('msg');
//}
//function loadStorage(id){
// var reselt = '

';
// for(var i=0;i// {
// var key = localStorage.key(i);
// var value = localStorage.getItem(key);
// var date = new Date();
// date.setTime(key);
// var datestr = date.toGMTString();
// reselt += '';
// }
// reselt += '

'+'这是第'+i+'条数据

'+value+'

'+datestr+'

';
// var target = document.getElementById(id);
// target.innerHTML = reselt;
//}
//function clearStorage(id){
// localStorage.clear();
// alert("数据已经被成功删除！");
// loadStorage('msg');
//}
/**
* Created by Administrator on 2014/11/27.
*/
function saveStorage(id){
var data = document.getElementById(id).value;
var time = new Date().getTime();
localStorage.setItem(time,data);
alert("数据已经被保存！");
loadStorage('msg');
}
function loadStorage(id){
var reselt = '';
for(var i=0;i {
var value = localStorage.getItem( localStorage.key(i));
var date = new Date();
date.setTime( localStorage.key(i));
var datestr = date.toGMTString();
reselt += '';
}
reselt += '

'+'这是第'+i+'条数据

'+ localStorage.getItem( localStorage.key(i))+'

'+datestr+'

';
var target = document.getElementById(id);
target.innerHTML = reselt;
}
function clearStorage(id){
localStorage.clear();
alert("数据已经被成功删除！");
loadStorage('msg');
}

 

转载于:https://www.cnblogs.com/taoda/p/9371390.html