Как удалить div в javascript без jquery?

Я пытаюсь удалить div при входе в систему (я знаю, что это небезопасно!). Мне нужно это в javascript! Все перепробовал, но удалять не хочет. код здесь ------------------------------------------------------------- -----------------------------------------> Я ЗНАЮ, ЭТО НЕ БЕЗОПАСНО! Почему-то скрипт не работает! попробовал все, что я знаю в javascript.

var box = document.getElementById("loginbox");
function pasuser(form) {
if (form.email.value= = "[email protected]") {
console.info(form.email.value)
if (form.password.value= = "123") {
  //window.location.assign('/index2.html');
  var next = document.createElement("IFRAME");
  next.src='https://codepen.io';
  next.classList.add("codepen");
  document.body.appendChild(next);
  //box.classList.remove("box");
  //box.style.display = "none";
  box.parentNode.removeChild(box);
  //box.outerHTML = "";
} else {
alert("Invalid Password");
}

} else {  alert("Invalid UserID");
}
}

body{
  margin: 0;
  padding: 0;
  font-family: sans-serif;
  background: url(https://i.ytimg.com/vi/WLs_DST6dTA/maxresdefault.jpg);
  background-size: cover;
}
.box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 400px;
  padding: 40px;
  background: rgba(0,0,0,.8);
  box-sizing: border-box;
  box-shadow: 0 15px 25px rgba(0,0,0,.5);
  border-radius: 10px;
}
.box h2 {
  margin: 0 0 30px;
  padding: 0;
  color: #fff;
  text-align: center;
  -webkit-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
}
.box h2:hover{
  letter-spacing: 5px;
}
.box .inputBox {
  position: relative;
}
.box .inputBox input {
  width: 100%;
  padding: 10px 0;
  font-size: 16px;
  color: #fff;
  letter-spacing: 1px;
  margin-bottom: 30px;
  border: none;
  border-bottom: 1px solid #fff;
  outline: none;
  background: transparent;
}
.box .inputBox label {
  position: absolute;
  top: 0;
  left: 0;
  letter-spacing: 1px;
  padding: 10px 0;
  font-size: 16px;
  color: #fff;
  pointer-events: none;
  transition: .5s;
}
.box .inputBox input:focus ~ label,
.box .inputBox input:valid ~ label {
  top: -24px;
  left: 0;
  color: #03a9f4;
  font-size: 12px;
}
.box .inputBox input:focus,
.box .inputBox input:valid  {
  top: -26px;
  left: 0;
  color: #fff;
  border: 1px solid #fff;
  border-radius: 5px;
}

.box .inputBox input:active + .placeholder {
  color: #fff;
}
.box .inputBox input:focus{
  border: solid 1px #03a9f4;
  border-radius: 5px;
  
}
.box input[type = "button"] {
  background: transparent;
  border: 2px solid #03a9f4;
  outline: none;
  color: #03a9f4;
  text-align: center;
  font-size: 15px;
  padding: 10px 20px;
  cursor: pointer;
  box-sizing: border-box;
  border-radius: 5px;
  -webkit-transition: all .2s ease-out;
  transition: all .2s ease;
}
.box input[type = "button"]:hover{
  border: 2px solid #03a9f4;
  background: #03a9f4;
  color: #fff;
  text-align: center;
  outline: none;
  font-size: 15px;
  padding: 10px 20px;
}
.codepen {
  width: 100%;
  border: none;
  height: 620px;
}
.hide {
display:none !important;
}

<!doctype html>
<html lang = "en">
<head>
  <meta charset = "UTF-8">
  <meta http-equiv = "X-UA-Compatible" content = "ie=edge">
  <link rel = "stylesheet" href = "/style.css">
  <script src = "/server.js"></script>
  <script src = "/next.js"></script>
  <title></title>
</head>
<body>
  <div id = "loginbox" class = "box">
    <h2>Login</h2>
    <form autocomplete = "on" method = "post" action = "./index2.html">
      <div class = "inputBox">
        <input id = "email" type = "email" name = "email" required = "" placeholder = "Username" autocomplete = "email" dir = "ltr" autocapitalize = "none">
        <label>Username</label>
      </div>
      <div class = "inputBox">
        <input id = "password" type = "password" name = "pass" required = "" placeholder = "Password" autocomplete = "new-password" dir = "ltr" autocapitalize = "off" autocorrect = "off">
        <label>Password</label>
      </div>
      <input id = "submitBtn" type = "button" value = "Submit" onclick = "pasuser(form)">
    </form>
    </div>
</body>
</html>

Возможный дубликат Удалить элемент по id

— 08.02.2019 14:02

какой div вам нравится удалять?

— 08.02.2019 14:06

Div с id = "loginbox"

— 08.02.2019 14:08

document.querySelector("#loginbox").remove()

— 08.02.2019 14:19

javascript html css

08.02.2019 14:00

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Попробуйте с:

document.getElementById("loginbox").remove();

чтобы соответствовать вашему коду:

box.remove();

Я только что попытался скопировать и вставить ваш код в html-файл, и он отлично работает. Не могли бы вы просто проверить сообщение, которое вы получаете на консоли, и вставить его сюда?

— 08.02.2019 14:15

Спасибо, забыл обновить страницу!

— 08.02.2019 14:19

08.02.2019 14:06