<div id="contenedor" class="container "> Nombre:<input type="text" id="nombre"> Edad:<input type="text" id="edad"> Sueldo:<input type="number" id="sueldo"> <button id="guardar" class="btn btn-success">Guardar datos</button> </div> <script src="js/test.js"></script>
document.getElementById('guardar').addEventListener('click', guardar) // Recupero el valor del localStorage const guardado = localStorage.getItem('empleado') // SI hay datos if (guardado != null) { console.log(guardado) // Convierto la cadena en objeto (parse) const empleado = JSON.parse(guardado) console.log(empleado) // Pongo los datos en el HTML document.getElementById('nombre').value = empleado.nombre document.getElementById('edad').value = empleado.edad document.getElementById('sueldo').value = empleado.sueldo } function guardar () { // Recupero los datos del HTML const nombre = document.getElementById('nombre').value const edad = document.getElementById('edad').value const sueldo = document.getElementById('sueldo').value // Creo un objeto con esos datos const empleado = { nombre: nombre, sueldo: sueldo, edad: edad } // Lo convierto a cadena (stringify) y lo guardo en el localStorage localStorage.setItem('empleado', JSON.stringify(empleado)) }
See the Pen
qBqjOYz by Juan Pablo Fuentes (@juan-pablo-fuentes)
on CodePen.