<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>本地存儲</title>
</head>
<body>
<input type="text" name="">
<input type="button" value="存儲" onclick=saveText()>
<input type="button" value="讀取" onclick=readText()>
<input type="button" value="刪除" onclick=clearText()>
<div id="text"></div>
<a href="本地存儲_1.html">讀取</a>
</body>
<script type="text/javascript">
// web 本地存儲方案
// localStorage 永久存儲 一直存儲除非手動清除 跨網(wǎng)站獲取
// sessionStorage 回話（臨時)存儲
// 大小:5Mb生命周期從瀏覽器打開開始到網(wǎng)頁關(guān)閉結(jié)束
var input = document.querySelector("input[type=text]");
function saveText(){
if(window.sessionStorage){
if(input.value != ""){
// 存儲 用setItem()方法兩個參數(shù) key value
window.sessionStorage.setItem("data", input.value);
input.value = "";
}else{
alert("您還沒有輸入內(nèi)容 不能進行存儲")
}
}else{
alert("您的瀏覽器不支持本地存儲，請及時更新")
}
}
function readText(){
var text = window.sessionStorage.getItem("data");
if(text){
document.querySelector("#text").innerHTML = text;
}else{
document.querySelector("#text").innerHTML = "";
alert("沒有獲取到任何內(nèi)容");
}
}
function clearText(){
// 刪除
window.localStorage.removeItem("data");
// readText();
}
</script>
</html>
