H5 -----WebStorage 基础用法

H5 -----WebStorage 基础用法

一. 分类

1》localStorage

2》sessionStorage

二.基础语法

1. 设置:
   xxx.setItem(key,value)
   xxx.name1 = ‘李四’;
   xxx[‘name2’] = ‘王五’;

<script>
	
//localStorage.setItem('name','zhangsan');

//sessionStorage.setItem('pwd','123456');


localStorage.name1 = '李四';
localStorage['name2'] = '王五';



</script>

2. 获取:
   xxx.getItem(key)
   xxx.key
   xxx[‘key’]

<script>
	
console.log( localStorage.getItem('name1')    );

console.log(  localStorage.name2 );

console.log(  localStorage['name'] );


</script>

3. 删除:

   删除某个:
   xxx.removeItem(key);
   全部删除:
   xxx.clear()

<script>
	
localStorage.removeItem('name1');
localStorage.removeItem('name');

localStorage.clear();



</script>

*注意点

本地存储的所有值都是string类型（字符串）

localStorage.setItem('num',123);

console.log( typeof localStorage.getItem('num') )//string

localStorage.setItem("bool",true);

console.log( typeof localStorage.getItem('bool') )//string


localStorage.setItem("arr",[]);

console.log( typeof localStorage.getItem('arr') )//string

----------------------------------------------------------------------------------------------------

localStorage和sessionStorage区别：

1>localStorage ==》永久性
2>sessionStorage ==》关闭浏览器自动消失