Estoy trabajando para proporcionar a un usuario dos imágenes diferentes según el nombre de usuario/contraseña correctos. Tengo una ventana emergente para que el usuario proporcione el nombre de usuario/contraseña y, después de proporcionar las credenciales correctas, debería aparecer la imagen de inicio de sesión y, si las credenciales son incorrectas, debería aparecer la imagen de cierre de sesión. Estoy usando getElementById para cambiar en consecuencia. En este momento aparece el mensaje, pero no se muestra ninguna imagen.
<img src="user_in.PNG" id="user_in_id" hidden> <img src="user_out.PNG" id="user_out_id" hidden> <script> var person = prompt("Please enter your name", ""); var password = prompt("Please enter your password", ""); if (person == "admin" && password =="admin") { alert("Welcome, You are now Logged in"); document.getElementById("user_in_id"); }else alert("wrong username or password"); document.getElementById("user_out_id"); </script>Debe aplicar una función a su selector document.getElementById("user_in_id") , que de alguna manera hace que el elemento seleccionado sea visible.
Una forma sería eliminar el atributo hidden con document.getElementById("user_in_id").removeAttribute("hidden");
También olvidó envolver su declaración else entre corchetes para que funcione correctamente.
<img src="https://styles.redditmedia.com/t5_3obin/styles/communityIcon_5v6pv5kqz5241.PNG" id="user_in_id" hidden> <img src="https://public.blenderkit.com/thumbnails/assets/0992088bfb844c69bb6e426272970c8b/files/thumbnail_c858218a-4afc-4e94-b6b9-080f5e6c7066.jpg.256x256_q85_crop-%2C.jpg" id="user_out_id" hidden> <script> var person = prompt("Please enter your name", ""); var password = prompt("Please enter your password", ""); if (person === "admin" && password === "admin") { alert("Welcome, You are now Logged in"); document.getElementById("user_in_id").removeAttribute("hidden"); }else{ alert("wrong username or password"); document.getElementById("user_out_id").removeAttribute("hidden"); } </script>