lovecoding
/
VIP26


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 
        cookie 与 webStorage的区别
            
        1.cookie会与服务器交互(速度变慢);
        2.cookie储存大小约4kb;
        3.webStorage是把数据储存到客户端,不会和服务器交互,可随机获取(速度快);
        4.webStorage储存大小是5MB,可储存的数据更大;
        注意：webStorage就是为了弥补cookie的缺陷;
        5.对于临时存储的数据使用sessionStorage更方便;
        6.webStorage不参与服务器通信,储存在本地更安全;
        7.webStorage中的键值对必须是字符串;使用时需要转JS对象;

     -->
     <script>
        // document.cookie = "name='LiLi'";
        // 修改
        var date = new Date();
        date.setTime(date.getTime() + (5*24*60*60*1000))
        document.cookie = "name='111';expires=" + date;
        // console.log(date.toUTCString())
        // 删除
        var date1 = new Date();
        // toUTCString世界時
        document.cookie = 'password="123";expires=' + date1.toUTCString(); 
        // document.cookie = 'password="123"'; 
        // 设置
        // function setCookie(cname,cValue,cTime) {
        //     var d = new Date();
        //     d.setTime(d.getTime()+(cTime * 24 *60 *60*1000));
        //     console.log(d,'d')
        //     var expires = "expires=" + d.toGMTString();

        //     document.cookie=cname +"="+cValue+";"+expires;
        // }
        // setCookie("address",'1212',3)
        // 获取
        console.log(document.cookie,'cookie')
        // web Storage
        // 存放数据：
        // 1.localStorage.setItem("属性名");
        // 2.localStorage.属性名;
        // 3.localStorage["属性名"];

        // 读取数据：
        // 1.localStorage.getItem("属性名");
        // 2.localStorage.属性名;
        // 3.localStorage["属性名"];

        // 3.删除一条数据
        // 语法：localStorage.removeItem("属性名");

        // 4.清除所有的数据
        // 语法：localStorage.clear();

        // 5.得到某个索引的key;
        // 语法：localStorage.key(下标);//注意：下标是整数;


        // 本地存储
        // localStorage
        localStorage.setItem("name",'lucy');
        localStorage.age = '10';
        localStorage['sex'] = '1';
    
        console.log(localStorage.getItem("name"))
        console.log(localStorage.age)
        localStorage.removeItem("sex");
        console.log(localStorage['sex'])

        localStorage.arr1 = {a: "A", city: "布加迪威龙", length: 2}
        console.log(localStorage.key(1.5))


        // 会话存储
        // sessionStorage
        sessionStorage.setItem("name",'lucy');
        sessionStorage.age = '10';
        sessionStorage['sex'] = '1';

        sessionStorage.clear();
     </script>
</body>
</html>