-
存儲內(nèi)容大小一般支持5M B左右(不同瀏覽器可能還不一樣)
-
瀏覽器端通過 Window.sessionStorage 和 Window.localStorage 屬性來實現(xiàn)本地存儲機制。
-
相關(guān)API:
1.xxxxxStorage.setItem('key', 'value');
該方法接受一個鍵和值作為參數(shù),會把鍵值對添加到存儲中,如果鍵名存在,則更新其對應(yīng)的值。
2.xxxxxStorage.getItem('person');
該方法接受一個鍵名作為參數(shù),返回鍵名對應(yīng)的值。
該方法接受一個鍵名作為參數(shù),并把該鍵名從存儲中刪除。
4.xxxxxStorage.clear()
該方法會清空存儲中的所有數(shù)據(jù)。
-
備注:
-
SessionStorage存儲的內(nèi)容會隨著瀏覽器窗口關(guān)閉而消失。
-
LocalStorage存儲的內(nèi)容,需要手動清除才會消失。
-
xxxxxStorage.getItem(xxx)
如果xxx對應(yīng)的value獲取不到,那么getItem的返回值是null。 -
JSON.parse(null)
的結(jié)果依然是null。
<body>
<h2>localstorage</h2>
<button onclick="saveData()">點我保存數(shù)據(jù)</button>
<button onclick="getData()">點我讀取一個數(shù)據(jù)</button>
<button onclick="deleteData()">點我刪除一個數(shù)據(jù)</button>
<button onclick="deleteAllData()">清空所有數(shù)據(jù)</button>
<script type="text/javascript">
function saveData(){
let p = {name:"張三",age:18}
localStorage.setItem("msg","hello!")
// JSON.stringify(p):把javascript對象轉(zhuǎn)換為一個字符串
localStorage.setItem('person',JSON.stringify(p))
}
function getData(){
msg = localStorage.getItem("msg")
person = localStorage.getItem("person")
// JSON.parse(person):解析成javascript對象
person= JSON.parse(person)
console.log(msg)
console.log(person)
}
function deleteData(){
localStorage.removeItem("msg")
}
function deleteAllData(){
localStorage.clear()
}
</script>
</body>
<body>
<h2>sessionStorage</h2>
<button onclick="saveData()">點我保存數(shù)據(jù)</button>
<button onclick="getData()">點我讀取一個數(shù)據(jù)</button>
<button onclick="deleteData()">點我刪除一個數(shù)據(jù)</button>
<button onclick="deleteAllData()">清空所有數(shù)據(jù)</button>
<script type="text/javascript">
function saveData(){
let p = {name:"張三",age:18}
sessionStorage.setItem("msg","hello!")
// JSON.stringify(p):把javascript對象轉(zhuǎn)換為一個字符串
sessionStorage.setItem('person',JSON.stringify(p))
}
function getData(){
msg = sessionStorage.getItem("msg")
person = sessionStorage.getItem("person")
// JSON.parse(person):解析成javascript對象
person= JSON.parse(person)
console.log(msg)
console.log(person)
}
function deleteData(){
sessionStorage.removeItem("msg")
}
function deleteAllData(){
sessionStorage.clear()
}
</script>
</body>
## 組件的自定義事件
本文摘自 :https://www.cnblogs.com/