web-storage

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>离线存储</title>
<link rel="stylesheet" href="">
</head>
<body>
<textarea id="value_text" cols="80" rows="10"></textarea>
<input id="btn_set" value="SET" type="button"></input>
<input id="btn_get" value="GET" type="button"></input>
<script type="text/javascript">
var btnSet = document.querySelector("#btn_set");
var btnGet = document.querySelector("#btn_get");
var txtValue = document.querySelector("#value_text");
btnGet.addEventListener("click",function(){
if (window.localStorage) {//兼容性判断
// txtValue.value = localStorage.getItem("key1");//两种方法，推荐使用
txtValue.value=localStorage['key1'];
}

});
btnSet.addEventListener("click",function(){
if (window.localStorage) {
// localStorage.setItem("key1",txtValue.value);
localStorage['key1'] = txtValue.value;
}

})
</script>
</body>
</html>

localStorage：离线存储，是永久的，如果不删除永远存在，是存储在local storage里面

sessionStorage：暂时的，浏览器关闭后消失，是存储在session storage里面

txtValue.value = localStorage.getItem("key1");
txtValue.value=localStorage['key1'];

两种方法是一样的，但是如果键不存的话，localStorage.getItem返回的是"",localStorage['key1']返回的是undefined

posted @ 2018-08-04 23:10 前端小童鞋阅读(129) 评论(0) 收藏举报

刷新页面返回顶部