本地存儲(localStorage惶我、sessionStorage媚污、web Database)
1.sessionStorage和localStorage
sessionStorage和localStorage兩種方法都是當用戶在inPut文本框中輸入內容并點擊保存數據按鈕時保存數據定枷，點擊讀取數據按鈕時讀取保存后的數據代嗤。不過使用sessionStorage時绊率，只能局限于當前頁面君编，如果關閉瀏覽器鹏秋，數據就會丟失尊蚁，下次打開瀏覽器就會讀不到數據。如果使用localStorage時侣夷，即使瀏覽器關閉横朋，下次打開瀏覽器仍能讀取到上次被保存的數據。但是數據的保存時按不同瀏覽器分別進行的百拓，也就是說琴锭，如果打開別的數據，就會讀取不到在這個瀏覽器中保存的數據衙传。
2.web Database
SQLLite的文件型SQL數據庫能將用戶輸入的數據保存到客戶端的本地數據庫中决帖；
樣式
<style>
html {
}
body {
margin: 0;
height: 2000px;
}
div {
height: 100px;
font-size: 18px;
background: red;
}
p {
height: 50px;
/* font-size: 18px; */
}
</style>
結構
用戶名：<input type="text" id="user">
密碼：<input type="password" id="password">
<!-- 登陸 -->
<input type="submit" id="submit">
js
<script>
var $ = function(id) {
return document.getElementById(id);
}
$('submit').onclick = function() {
var user = $('user').value;
var password = $('password').value;
var ls = window.localStorage;
var ss = window.sessionStorage;
ls.setItem('user', user);
ss.setItem('password', password);
}
~function() {
var ls = window.localStorage;
var ss = window.sessionStorage;
var user = ls.getItem('user');
var password = ss.getItem('password');
$('user').value = user;
$('password').value = password;
}();
</script>
這樣一個簡單的郵箱本地儲存就完成啦！
希望我的理解可以給你們提供一些幫助蓖捶，學識有限地回，如果有地方出現錯誤或者有更好的方法去實現，歡迎私信俊鱼！
