打开文件index.html，完善如图所示的登录界面 要求：1.对用户名、密码做必填项验证(10分) 2.用户名内容为字母、数字的组合且长度为6-10; 密码为6个数字(10分) 3.密码和确认密码保持一致，使用js判断(10分)

对于这个问题，我需要先说明一下，我无法看到你所说的“如图所示”的界面，因此我无法提供具体的代码。不过，我可以提供一些思路和大致的代码示例，帮助你完成这个任务。

首先，你需要打开 index.html 文件，并在其中添加用户名和密码的输入框，以及登录按钮。可以参考下面的代码：

<form>
  <div>
    <label for="username">用户名：</label>
    <input type="text" id="username" name="username">
  </div>
  <div>
    <label for="password">密码：</label>
    <input type="password" id="password" name="password">
  </div>
  <div>
    <label for="confirm-password">确认密码：</label>
    <input type="password" id="confirm-password" name="confirm-password">
  </div>
  <button type="submit" id="login-btn">登录</button>
</form>

接下来，你需要使用 JavaScript 来对用户名、密码和确认密码进行验证。可以参考下面的代码：

<script>
  var usernameInput = document.getElementById('username');
  var passwordInput = document.getElementById('password');
  var confirmPasswordInput = document.getElementById('confirm-password');
  var loginBtn = document.getElementById('login-btn');

  loginBtn.addEventListener('click', function(event) {
    if (usernameInput.value === '' || passwordInput.value === '' || confirmPasswordInput.value === '') {
      alert('用户名和密码为必填项！');
      event.preventDefault();
      return;
    }

    if (!/^[a-zA-Z0-9]{6,10}$/.test(usernameInput.value)) {
      alert('用户名必须为字母、数字的组合，长度为6-10位！');
      event.preventDefault();
      return;
    }

    if (!/^\d{6}$/.test(passwordInput.value)) {
      alert('密码必须为6个数字！');
      event.preventDefault();
      return;
    }

    if (passwordInput.value !== confirmPasswordInput.value) {
      alert('密码和确认密码不一致！');
      event.preventDefault();
      return;
    }
  });
</script>

上面的代码中，我们首先获取了用户名、密码和确认密码的输入框，以及登录按钮。然后，我们给登录按钮添加了一个点击事件监听器，在点击登录按钮时进行验证。

首先，我们判断了用户名、密码和确认密码是否为空，如果是，则弹出提示框，并阻止表单提交。然后，我们使用正则表达式验证了用户名和密码的格式，如果不符合要求，则同样弹出提示框，并阻止表单提交。最后，我们判断了密码和确认密码是否一致，如果不一致，则同样弹出提示框，并阻止表单提交。

这样，我们就完成了对用户名、密码和确认密码的验证。当用户点击登录按钮时，如果输入的内容不符合要求，则会弹出相应的提示框，阻止表单提交。