麻烦老师检查

来源：2-12 自由编程

dww1

2022-05-15 16:21:59

<style>
        form{
            margin: 50px auto;
            text-align: center;
        }
        p{
            margin-left: 22px;
        }
        button{
            width: 60px;
            height: 30px;
            margin-left: 10px;
            border: none;
            border-radius: 10px;
            color: #fff;
        }
        #login{
            background-color: green;
        }
        #delete{
            background-color: red;
        }
    </style>
</head>
<body>
    <form action="">
        用户名：<input id='input' type="text" placeholder="请输入用户名">
        <p>
            <button id="login">登录</button>
            <button id="delete">删除</button>
        </p>
       
    </form>
    <script type="module">
        import{set, get, remove } from './cookie.js';
        const input=document.getElementById('input');
        const loginBtn=document.getElementById('login');
        const delBtn=document.getElementById('delete');

        if(document.cookie !==''){
            input.value=get('username');
        }
        loginBtn.addEventListener('click',()=>{
            set('username',input.value, {maxAge:7 * 24 *3600})
        },false);
        delBtn.addEventListener('click',()=>{
            remove('username')
        },false)
    </script>

// 写入 Cookie
const set = (name, value, { maxAge, domain, path, secure } = {}) => {
    let cookieText = `${encodeURIComponent(name)}=${encodeURIComponent(value)}`;
    if (typeof maxAge === 'number') {
      cookieText += `; max-age=${maxAge}`;
    }
    if (domain) {
      cookieText += `; domain=${domain}`;
    }
    if (path) {
      cookieText += `; path=${path}`;
    }
    if (secure) {
      cookieText += `; secure`;
    }
    document.cookie = cookieText;
    // document.cookie='username=alex; max-age=5; domain='
  };
  // 通过 name 获取 cookie 的值
  const get = name => {
    name = `${encodeURIComponent(name)}`;
    const cookies = document.cookie.split('; ');
    for (const item of cookies) {
      const [cookieName, cookieValue] = item.split('=');
      if (cookieName === name) {
        return decodeURIComponent(cookieValue);
      }
    }
    return;
  };
  // 'username=alex; age=18; sex=male'
  // ["username=alex", "age=18", "sex=male"]
  // ["username","alex"]
  // get('用户名');
  // 根据 name、domain 和 path 删除 Cookie
  const remove = (name, { domain, path } = {}) => {
    set(name, '', { domain, path, maxAge: -1 });
  };
  export { set, get, remove };

写回答

1回答