当表单验证失败时，如何获得带阴影的文本框？

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" required>
  <br>
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" required>
  <br>
  <input type="submit" value="Submit">
</form>

input {
  /* 其他文本框样式 */
}

input.error {
  box-shadow: 0 0 5px red;
}

// 当表单验证失败时，为文本框添加error类
document.getElementById("username").classList.add("error");