JavaScript中check()函数失效求助：登录验证始终提示账号密码错误

嘿，我一眼就看出你的check()函数为啥不工作了，咱们来拆解问题并修复它！

问题根源 #

你现在的代码犯了两个关键错误：

• 你用document.getElementById("user")获取的是<div id="user">这个容器元素，而不是里面输入框的用户输入内容。一个DOM元素对象永远不可能和字符串"Guy"相等，所以你的条件永远不成立，自然只会弹出错误提示。
• 你的输入框没有设置id属性，只有name属性，就算你想直接获取输入框，用getElementById也拿不到目标元素。

修复步骤 #

1. 给输入框添加id属性

先修改HTML里的输入框，给它们加上唯一的id，方便后续获取：

<div id="user">
  <input type="text" id="username" name="user" placeholder="Username">
</div>
<div id="pass">
  <!-- 这里建议把type改成password，输入时会隐藏内容，更安全 -->
  <input type="password" id="password" name="pass" placeholder="Password">
</div>

2. 修改check()函数，正确获取输入值

现在我们要获取输入框的value属性（这才是用户输入的内容），再进行判断：

function check() {
  // 获取用户名和密码的输入值
  const username = document.getElementById("username").value;
  const password = document.getElementById("password").value;
  
  // 严格比较输入值和预设的账号密码
  if (username === "Guy" && password === "123") {
    alert("Welcome!");
  } else {
    alert("Invalid username or password!");
  }
}

额外小建议 #

• 密码输入框用type="password"是更标准的做法，能保护用户隐私。
• 实际开发中不要把账号密码硬编码在前端，这非常不安全，应该通过后端接口验证。

内容的提问来源于stack exchange，提问作者Cobra Slasher