HTML - 存储 Local & Session St
2017-08-08 本文已影响41人
由宇婷
[一点点笔记]
需要HTML 和 JS .
注意区分:
Session storage:关闭浏览器就都没有了
local storage:存储于本地.
1 Session Storage
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>this is session storage</title>
<script src ='sessionSave.js'> </script>
</head>
<body>
<p id = 'msg'></p>
<input type="text" id="input">
<input type="button" value="save" onclick="saveStorage('input')">
<input type="button" value="load" onclick="loadStorage('msg')">
</body>
</html>
sessionSave.js
function saveStorage(id) {
var target =document.getElementById(id);
var str = target.value;
sessionStorage.setItem("message",str);
}
function loadStorage(id) {
var target =document.getElementById(id);
var msg = sessionStorage.getItem("message");
target.innerHTML =msg;
}
image.png
点击save保存， 点击load显示
刷新仍可继续显示，关闭浏览器内容丢失。
——————————————————————————————————————
2.local storage
只需把JS里的 sessionStorage 换成localStorage极客
image.png
点击save保存， 点击load显示
刷新仍可继续显示，关闭浏览器内容仍保留着。
