Almacén de Datos en tu navegador con sessionStorage
¿Qué es sessionStorage?
Es una propiedad que accede al objeto Storage y tienen la función de almacenar datos de manera local, estos datos se almacenan mientras la pestaña donde se esté utilizando siga abierta, una vez cerrada, la información se elimina.
EJEMPLO:
<!DOCTYPE html>
<html> <body> <h2>Formulario SessionStorage</h2> <label for="fname">Nombre:</label><br> <input type="text" id="fname" name="fname"><br> <label for="lname">Apellido:</label><br> <input type="text" id="lname" name="lname"> <p><input type="button" id="Create" value="Guardar"> <input type="button" id="Read" value="Consultar"> <input type="button" id="Update" value="Modificar"> <input type="button" id="Delete" value="Eliminar"> </p> </body> <script type="text/javascript"> window.onload = function(){ var c = document.getElementById('Create'); var r = document.getElementById('Read'); var u = document.getElementById('Update'); var d = document.getElementById('Delete'); c.onclick = function () { var name = document.getElementById('fname').value; var lname = document.getElementById('lname').value; window.sessionStorage.setItem('Nombre', name); window.sessionStorage.setItem('Apellido', lname); alert('Elmentos Guardados'); }; r.onclick = function () { var name = document.getElementById('fname').value; var lname = document.getElementById('lname').value; if ((name != '' && name != null) || (lname != '' && lname != null)) { sname = window.sessionStorage.getItem('Nombre'); slname = window.sessionStorage.getItem('Apellido'); if (name == sname || slname == lname) { alert(window.sessionStorage.key(0) + sname + ' Apellido: ' + slname); } else { alert('Datos no encontrado'); } } else { alert('Datos no encontrado');} } u.onclick = function () { var name = document.getElementById('fname').value; var lname = document.getElementById('lname').value; if (name != '' && name != null) { window.sessionStorage.setItem('Nombre', name); }if(lname != '' && lname != null){ window.sessionStorage.setItem('Apellido', lname); } else{ alert('No pudo actualizar elementos'); } }; d.onclick = function () { window.sessionStorage.clear(); alert('Datos Eliminados'); }; }; </script> </html>Video:
Comentarios
Publicar un comentario