Quiero agregar el nombre de mi casilla de correo en la parte superior de mi página, pero se muestra durante unos segundos y se apaga.
Lo que quiero es que, por ejemplo, INBOX se muestre en la parte superior de la página, luego todos los correos de la bandeja de entrada estarán debajo del título.
El INBOX se muestra durante nanosegundos y luego los correos de mi bandeja de entrada se cargan y lo eclipsan.
¿Cómo puedo resolver esto?
function load_mailbox(mailbox) { // Show the mailbox and hide other views document.querySelector('#emails-view').style.display = 'block'; document.querySelector('#compose-view').style.display = 'none'; document.querySelector('#content-view').style.display = 'none'; //Show the mailbox name document.querySelector('#emails-view').innerHTML = `<h3>${mailbox.charAt(0).toUpperCase() + mailbox.slice(1)}</h3>`; // display details of mailbox let output = ''; // using get request to retrieve details fetch(`/emails/${mailbox}`) .then(response => response.json()) .then(emails => { emails.forEach(email => { //display subjecct, sender and timestamp of mail output += `<div class="mail" onclick="viewEmail(${email.id}, ${mailbox})"> <button class="btn pr-5" style="min-width: 120px; display: inline-block;">${email.sender}</button> <button class="btn">${email.subject}</button> <button class="badge float-right">${email.timestamp}</button> <span class="list-group-item"></span> </div>`; }) //add to html emails view let emailList = document.querySelector('#emails-view'); emailList.innerHTML = output; }); } <div id="emails-view"> </div>El nombre de su casilla de correo se sobrescribirá tan pronto como se procese su solicitud de fetch .
Tienes dos opciones.
#2 es mucho más preferible.