cookie

84 阅读1分钟
<!-- 
        cookie
          => cookie前端本存储数据的一种技术
          => 文本字符串形式: 每条cookie数据以key=value形式存储
                 'username=admin;password=123'
          => 存储大小4k
          => 存储时间 
                可以自己定义
                默认会话级别
          =>域名有关
          
          =>使用cookie
             let cookie = document.cookie
             document.cookie = 'username=admin'
             document.cookie = 'password=123'

          =>浏览器查看cookie
     -->
    <h2>cookie技术学习</h2>
    <p></p>
    <button class="add">添加cookie数据</button>
    <button class="find">查看cookie数据</button>
    <button class="remove">删除cookie数据</button>
        const addBtn = document.querySelector('.add')
        const findBtn = document.querySelector('.find')
        const removeBtn = document.querySelector('.remove')
        const showP = document.querySelector('p')

        addBtn.addEventListener('click',function(){
            let time = new Date()
            console.log(time);
            let t = time.getTime() + 1000*60*60*24
            time.setTime(t)
            console.log(time);

            document.cookie = 'username=root;expires='+time
            document.cookie = 'password=123'
        })

        findBtn.addEventListener('click',function(){
            showP.innerHTML =  document.cookie
            //查看名称为username的这条数据
            
        })

        removeBtn.addEventListener('click',function(){
            document.cookie = 'username=root;expires=Thu, 18 Dec 2021 12:00:00 GMT'
        })