最近又在学习登录注册的知识，我把之前写的代码分享一下，大家相互交流一下！
以下是完整代码：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
margin-top: 20px;
}
.btn {
margin-top: 20px;
margin-left: 75px;
font-size: 15px;
}
p {
margin-left: 30px;
font-size: 20px;
font-weight: bold;
color: red;
}
label {
display: inline-block;
70px;
text-align: right;
}
</style>
</head>
<body>
<form action="">
<p>注册</p>
<div>
<label for="name">姓名</label>
<input type="text" placeholder="请输入名字" name="username" id="name">
</div>
<div>
<label for="password">密码</label>
<input type="password" placeholder="请输入密码" name="password" id="password">
</div>
<div>
<label for="passwords">确认密码</label>
<input type="password" placeholder="请确认密码" name="passwords" id="passwords">
</div>
<input type="button" value="注册" class="btn">
</form>
<script>
const btn = document.querySelector(".btn");
btn.addEventListener("click", function () {
const loginForm = document.querySelector("form");
const [username, password] = [loginForm.username.value, loginForm.password.value];
let user = JSON.parse(localStorage.getItem("user"));
const isLogin = user.some(user => user.username === username);
if (loginForm.username.value.length > 0 && loginForm.password.value.length > 0 && loginForm.passwords.value.length > 0) {
if (loginForm.password.value === loginForm.passwords.value) {
if (isLogin) {
alert("此用户名已被使用，请更换名字！")
} else {
user = [...user, ...[{ name: username, pwt: password }]];
localStorage.setItem("user", JSON.stringify(user));
alert("恭喜您，注册成功此用户可以使用");
}
} else {
alert("你确定你两次密码相同？重新输入！");
}
} else {
alert("你确定你输入正确了吗？");
}
})
</script>
</body>
</html>