webStorage向浏览器存储数据

Posted 2021-09-14 胖大大

webStorage有两兄弟: sessionStorage(关闭浏览器就没了),localStorage(只要不自己删就算关闭浏览器也还在,下次进入同一个页面,还是存在)
用法: 基本上就是存字符串或者json

保存/修改(保存会修改原来的数据)

const localObj = { name:\'张三\', age: 23 }
const sessionObj = { name: \'李四\', age: 24 }
localStorage.setItem( \'localData\' , JSON.stringify(localObj ) )
sessionStorage.setItem( \'sessionData\' , JSON.stringify(sessionObj ) )

获取

console.log(JSON.parse(localStorage.getItem(\'localData\')))
console.log(JSON.parse(sessionStorage.getItem(\'sessionData\')))

删除单个

localStorage.removeItem("localData")
sessionStorage.removeItem(\'sessionData\')

删除全部

localStorage.clear();
sessionStorage.clean();

监听(不太懂)

//Storage 发生变化（增加、更新、删除）时的 触发，同一个页面发生的改变不会触发，只会监听同一域名下其他页面改变
 Storagewindow.addEventListener(\'storage\', function (e) {　　
    console.log(\'key\', e.key);
    console.log(\'oldValue\', e.oldValue);　　
    console.log(\'newValue\', e.newValue); 
    console.log(\'url\', e.url);
})

localStorage在浏览器的隐私模式下面是不可读取的。
localStorage本质上是对字符串的读取，有json格式时需要JSON.stringify()转化为字符串。
localStorage不能被爬虫抓取