浏览器本地存储(Html5新增:WebStorage)

1.localStorage:本地存储,浏览器刷新页面还会存在,除非手动去删除,否则会一直存在,写在本地硬盘中

1.设置属性:localStorage.setItem('属性值','属性名'),属性名和属性值都必须是字符串,如果传入Number类型的值会被自动转为字符串,如果是对象,则必须调用JSON.stringify来转换为JSON格式的字符串()

代码示例:localStorage.setItem('msg','hello') ---值为字符串类型

代码示例:localStorage.setItem('msg',JSON.stringify(ObjectName)) ---值为对象类型

 

2.读取属性:localStorage.getItem('属性名') 如果要读取的属性名的属性值为对象可以使用JSON.parse()解析转为对象

代码示例:localStorage.getItem('msg') ---值为字符串类型

代码示例:let obj = localStorage.getItem('ObjectName') obj = JSON.parse(obj) ---值为对象类型

 

3.删除属性:loaclStorage.removeItem('属性名')

示例代码:loaclStorage.removeItem('msg')

4.清空属性:loaclStorage.clear()

2.sessionStorage:会话存储:浏览器刷新页面就会消失

1.设置属性:sessionStorage.setItem('属性值','属性名'),属性名和属性值都必须是字符串,如果传入Number类型的值会被自动转为字符串,如果是对象,则必须调用JSON.stringify来转换为JSON格式的字符串()

代码示例:sessionStorage.setItem('msg','hello') ---值为字符串类型

代码示例:sessionStorage.setItem('msg',JSON.stringify(ObjectName)) ---值为对象类型

 

2.读取属性:sessionStorage.getItem('属性名') 如果要读取的属性名的属性值为对象可以使用JSON.parse()解析转为对象

代码示例:sessionStorage.getItem('msg') ---值为字符串类型

代码示例:let obj = sessionStorage.getItem('ObjectName') obj = JSON.parse(obj) ---值为对象类型

 

3.删除属性:sessionStorage.removeItem('属性名')

示例代码:sessionStorage.removeItem('msg')

4.清空属性:sessionStorage.clear()

注意:读取没有的属性值会返回null,JSON.parse(null)的结果还是null