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