Usando el método localStorage de JavaScript podemos guardar datos en el propio navegador. Esto nos permite guardar los datos que queramos y que al cerrar el navegador o incluso al reiniciar el PC podamos seguir accediendo a los datos sin problema.
El código en GitHub: https://github.com/magnitopic/edujs/tree/master/ListaCompraJS
Mira el codigo ejecutandose en relp.it: https://listacomprajs.valoro.repl.co/
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Main HTML</title>
</head>
<body>
<h1>Lista de la compra</h1>
<p>Añadir item a la lista</p>
<input type="text" id="entrada">
<button onclick="anadir()">Añadir</button>
<div id="resultado">
<ul id="lista-compra"></ul>
</div>
<script src="script.js"></script>
</body>
</html>
script.js
'use strict'
var contador= 0;
function anadir(){
var x = document.getElementById("entrada").value;
if(x.length <= 0){
}else{
localStorage.setItem(x,x);
location.reload();
}
}
var ul = document.getElementById('lista-compra');
for(var i in localStorage){
if(typeof localStorage[i] =='string'){
var li= document.createElement("li");
li.append(localStorage[i]);
ul.append(li);
}
}
No hay comentarios:
Publicar un comentario