用JavaScript从页面中删除div

Question

一旦收到XMPHttpRequest响应，我正试图从页面中删除一个div。我还尝试使用: document.getElementById('password').style.display =‘none’将div的显示设置为none；但这也不起作用。

HTML：

 <div class="login-container">
      <div class="title">Login Form</div>
      <div class="form-fields" id="form-fields">
           <form name="login_form" method="post" id="login-form" onsubmit="return submitForm()">
                <input type="text" name="username" id="username" placeholder="Username" required></input>
                <input type="password" name="password" id="password" placeholder="Password" required></input>
                <input type="submit" value="Log in" id="submit-button"></input>
                <input id="sessionID" class="hidden"></input>
           </form>
      </div>
      <div id="success-message" class="hidden">Congratulations! You have been logged in.</div>
      <button id="logout" class="hidden"></button>
 </div>

Javascript函数：

 function sendLoginInfo() {
      var loginRequest = new XMLHttpRequest();
      loginRequest.open("POST", "server/login.php", false);
      loginRequest.setRequestHeader('Content-type', "application/json");
      loginRequest.onreadystatechange = function () {
           if(loginRequest.readyState == 4 && loginRequest.status == 200) {
                sessionID = keyRequest.responseText;
                var el = document.getElementById( 'password' );
                el.parentNode.removeChild( el );

           }
      }
      loginRequest.send(JSON.stringify(JSONFormData));
 }

更新

这一问题是通过改变：

<form name="login_form" method="post" id="login-form" onsubmit="return submitForm()">

至：

<form name="login_form" method="post" id="login-form" onsubmit="submitForm(); return false;">

Answer 1

而不是

document.getElementById('password').style.display = 0;

试一试

document.getElementById('password').style.display = 'none';

Answer 2

据我所知，您不能真正删除div，但是可以将div的可见性设置为"none“(而不是您尝试的"0”)。

style="display:none"

这使得div不可见，不会有任何空白。