1

Tengo el siguiente código, el cual pues no es mio, cuento con poco conocimiento en Javascript, sin embargo si se que este código lanza una especie de Array en el LocalStorage, lo que quisiera hacer es mostrar en el DOM únicamente el nombre para poder poner Bienvenido y el nombre del usuario. Lo que esta guardado en el Storage es como valor es {name: "Angelo", contact: "85002011", addr: "San Antonio} addr1: "San Antonio" contact: "85002011" name: "Angelo" y la llave es = (adress)

el codigo que tengo es el siguiente

$(document).ready(function() {
   try {
       if (localStorage.adress) {
           waddr = JSON.parse(localStorage.adress);
           document.getElementById('elname').value = waddr.name;
           document.getElementById('elmobile').value = waddr.contact;
           document.getElementById('eladdress').value = waddr.addr;
           updateEladdress();

       }
   } catch (error) {
       console.error(error);
   }
});
7
  • Intente hacerlo con esto ``` var nombre = window.localStorage.getItem('adress'); document.getElementById("resultado").innerHTML = nombre; ``` pero me lanza todo el array que esta guardado ademas de los corchetes el 27 ene. 2021 a las 15:51
  • Hola @Benito-B ¿Podrias intentar ser mas amable al pedir información sobre una pregunta? el 27 ene. 2021 a las 16:15
  • 1
    Para usuarios nuevos puede ser intimidante recibir este tipo de respuestas, no es genial hacer preguntas pasivo agresivas como '¿y como pretendes?' puede resultar ofensivo y retante. el 27 ene. 2021 a las 16:28
  • @AngeloAguilar Si ya editaste tu pregunta lo puedes aclarar en el comentario en lugar de repetir el edit, esto es para que quien quiera ayudarte obtenga el contexto completo de nuevo :D un saludo. el 27 ene. 2021 a las 16:29
  • Hola @Benito-B Lo que esta guardado en el Storage es como valor es {name: "Angelo", contact: "85002011", addr: "San Antonio} y la llave es = (adress) el 27 ene. 2021 a las 16:33

1 respuesta 1

3

Lo que debes hacer es añadir un evento cuando cargue tu página web. A partir de ahí haces un llamado a localStorage para obtener la información del usuario y poder colocarla en un elemento del DOM.

De esta manera, con este código HTML y JS, podrás mostrar la información del usuario si se encuentra en localStorage.

NOTA: Para fines de la demo, yo creo el objeto en localStorage la primera vez que carga la página. Pero yo supongo que ésta información va venir de un API o previamente ya estará almacenada en respuesta a alguna función.


<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Documento de prueba para javascript</title>
  </head>
  <body>
    <h1 class="user-name">Hola</h1>
    <script src="./sample.js"></script>
  </body>
</html>


y tu Javascript:


function getUserInformation() {
  const userInformation = JSON.parse(localStorage.getItem("userInformation"));
  if (!userInformation) {
    localStorage.setItem(
      "userInformation",
      JSON.stringify({
        name: "Jhon",
        lastname: "Doe",
        adress: "No Doe Address",
      })
    );
  }

  const h1Element = document.querySelector(".user-name");

  h1Element.textContent = `Hola ${userInformation.name}`;
}

window.addEventListener("load", getUserInformation);


1
  • WOW Exelente muchas gracias , funciono pèrfectamente el 27 ene. 2021 a las 16:56

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.