html5---本地存储账号_html账号密码存放在哪个文件里-优快云博客

本文链接：https://blog.youkuaiyun.com/sjtu_chenchen/article/details/45677303

本文介绍了JavaScript中使用Cookie和LocalStorage进行用户数据存储的方法，包括如何设置、读取以及清除数据，并通过实例展示了如何在登录页面中实现用户信息的保存与加载。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!doctype html>
<html>
    <head>
    </head>
    <body>
    <script>
    //cookie存储量小,生存周期与sessionStoage一样,localStorage存储量大，永久保存
     document.cookie="name=zhangsan";
     alert(document.cookie);
     localStorage.setItem("name","lisi");
     alert(localStorage.getItem("name"));
     sessionStorage.setItem("name","wangwu");
     alert(sessionStorage.getItem("name"))
    </script>
    </body>
</html>



<!doctype html>
<html>
    <head>
    <script>
     window.onload=function  () {
      var names=document.getElementsByName("names")[0]; //获取姓名
      var pass=document.getElementsByName("pass")[0];  //获取密码
      var save=document.getElementsByName("save")[0];  //获取是否保存
      if(localStorage.getItem("names")&&localStorage.getItem("pass")){//如果本地已经存储过
         names.value=localStorage.getItem("names");     //更新
         pass.value=localStorage.getItem("pass");
         save.checked=true;
      }
      save.onclick=function  () {
       if(save.checked){    //如果要保存
         localStorage.setItem("names",names.value);
         localStorage.setItem("pass",pass.value);
       }else{
         localStorage.removeItem("names");
         localStorage.removeItem("pass");
       }
      }
     }
    </script>
    </head>
    <body>
       用户名:<input type ="text" name="names"><br/>
       密码:<input type="password" name="pass"><br/>
       是否永久保存<input type="checkbox" name="save">
    </body>
</html>