<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>本地存储sessionStorsge</title>
</head>
<body>
<input type="text" id="msg">
<input type="button" id="setData" value="保存数据">
<input type="button" id="getData" value="获取数据">
<input type="button" id="removeData" value="清除数据">
<input type="button" id="clearData" value="全部清空">
<script>
window.onload= function () {
alert("当你关闭此页面或者关闭浏览器的时候，sessionStorage中保存的数据才会消失，也就是说重新打开此页面的时候，点击获取数据 ，将不会显示任何数据，刷新页面无效。
由此可以证明，sessionStorage的生命周期为，某个用户浏览网站时，从进入到离开的这段时间。");
var msg=document.getElementById('msg');
var setData=document.getElementById('setData');
var getData=document.getElementById('getData');
var removeData=document.getElementById('removeData');
var clearData=document.getElementById('clearData');
setData.onclick= function () {//存入数据
if(msg.value){
sessionStorage.setItem('data',msg.value);
alert('信息已保存中data字段中');
}else {
alert('信息不能为空')
}
};
getData.onclick= function () {//获取数据
var msg = sessionStorage.getItem('data');
if(msg){
alert('data字段中的值为'+msg);
}
else {
alert('data字段无值');
}
};
removeData.onclick= function () {//清除部分选定的数据
var msg = sessionStorage.getItem('data');
if(msg){
sessionStorage.removeItem('data');
}else {
alert('data字段中的数值为空')
}
};
clearData.onclick=function(){//清楚全部数据
sessionStorage.clear();
}
}
</script>
</body>
</html>