La combinación de HTML5 con librerías de Javascript suele ser una combinación ganadora y que aporta una gran flexibilidad .Muchas veces podemos necesitar trabajar con datos de forma local y hacer diversos filtros y operaciones sobre ellos. Es muy habitual trabajar con LocalStorage HTML5 y por ejemplo LowDash para realizar operaciones a nivel local, vamos a ver un ejemplo clásico. Para ello vamos a almacenar una estructura JSON en un LocalStorage usando JSON.stringify().
Vamos a verlo en código a través del botón de salvar:
<html> <head> <script src="jquery-1.11.1.js" type="text/javascript"></script> <script src="jquery-1.11.1.js" type="text/javascript"></script> <script type="text/javascript" src="lowdash.js"> </script> <script type="text/javascript"> $(document).ready(function() { $("#salvar").click(function() { var lista={"personas": [ { "nombre": "pedro", "apellidos": "perez" }, { "nombre": "ana", "apellidos": "gomez" }, { "nombre": "david", "apellidos": "gonzalez" }, { "nombre": "maria", "apellidos": "gomez" }, ] } sessionStorage["personas"]= JSON.stringify(lista); }); $("#ordenar").click(function() { var personas= JSON.parse(sessionStorage["personas"]); console.log(personas.personas); var resultado=_.sortBy(personas.personas,'nombre'); console.log(resultado); }); }); </script> </head> <body> <input type="button" id="salvar" value="salvar"/> <input type="button" id="ordenar" value="ordenar"/> </body> </html>El botón de salvar almacena los datos en el LocalStorage.
En cambio el botón de ordenar leerá los datos que se encuentran almacenados en el LocalStorage y utilizando LowDash y el método sortBy los imprimirá por la consola ordenados.
De esta forma podemos reducir las peticiones al servidor y almacenar los datos de forma local y trabajar con ellos.
Otros artículos relacionados: Utilizando Underscore.js , Ajax métodos globales ,JQuery find vs filter
Buenas.
¿Por qué si el artículo se titula localstorage aparece en el código sessionstorage? 😀
P.D. Me he subscrito a algunos de tus cursos y me encanta tu blog, le echo un vistazo casi todos los días. A nivel técnico poco te puedo decir, pero en cuanto a escritura, mis retinas te agradecerían que les pasaras un corrector ortográfico antes de publicarlos. “ha almacenar” no lleva hache.
Saludos.
corregido 🙂
[…] artículos relacionados:LocalStorage y LowDash , JavaScript Console , LoDash y […]
[…] artículos relacionados: HTML5 LocalStorage , HTML5 Visibility API , HTML5 Data […]
[…] artículos relacionados : LocalStorage y LoDash , HTML Data […]
¿Aun no esposible acceder desde java a localStrage, seria factible esto? las cookies tienen un tamaño limitado y seria genial que java tuviera una clase que manejara directamente localStorage
Me temo que no Localstorage es un api de javascript puro. Recuerda que las cookies pertenecen mas al protocolo HTTP que a html o javascript