html5中localStorage存储

<ul id="ulMessage"></ul>
<div>
学号:<input type="text" id="txt_xh" />
姓名:<input type="text" id="txt_name" />
分数:<input type="text" id="txt_fenshu" />
<input type="button" value="保存" onclick="javascript: savedata();" />
<input type="button" value="清空" onclick="javascript: localStorage.clear();" />
</div>

function $$(id) {
return document.getElementById(id);
}
function savedata() {
var setdata = new Object();
setdata.id = $$("txt_xh").value;
setdata.name = $$("txt_name").value;
setdata.fenshu = $$("txt_fenshu").value;
localStorage.setItem($$("txt_xh").value, JSON.stringify(setdata));
initData();
$$("txt_xh").value = "";
$$("txt_name").value = "";
$$("txt_fenshu").value = "";
}
function initData() {
//初始化数据
var tempstr = "";
tempstr = "<table width='80%'>";
tempstr += "<tr><td width='30%'>学号</td> <td width='30%'>姓名</td> <td width='30%'>分数</td><TD>修改</td><TD>删除</td></tr>"
//alert(localStorage.length);
for (var k = 0; k < localStorage.length; k++) {
//alert(localStorage.key(k));
var item = JSON.parse(localStorage.getItem(localStorage.key(k)));
tempstr += "<tr>";
tempstr += "<td width='30%'>" + item.id + "</td>    ";
tempstr += "<td width='30%'>" + item.name + "</td>  ";
tempstr += "<td width='30%'>" + item.fenshu + "</td>";
tempstr += "<TD><a href='javascript:void(0)' onclick='edit("+k+")'>修改</a></td>";
tempstr += "<TD><a href='javascript:void(0)' onclick='del(" + k + ")'>删除</a></td>";
tempstr += "</tr>";
}
tempstr += "</table>";
$$("ulMessage").innerHTML = tempstr;
}
function edit(k)
{
if (k < localStorage.length)
{
var item = JSON.parse(localStorage.getItem(localStorage.key(k)));
$$("txt_xh").value = item.id;
$$("txt_name").value = item.name;
$$("txt_fenshu").value = item.fenshu;
}
}
function del(k)
{
if (k < localStorage.length)
{
var key = localStorage.key(k);
//alert(key);
localStorage.removeItem(key);
initData();
}

}