1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
|
---
title: Window.localStorage
slug: Web/API/Window/localStorage
tags:
- API
- Propiedad
- Referencia
- Web Storage
- WindowLocalStorage
- localStorage
translation_of: Web/API/Window/localStorage
---
<p>{{APIRef()}}</p>
<p>La propiedad de sólo lectura <strong><code>localStorage</code></strong> te permite acceder al objeto local {{DOMxRef("Storage")}}; los datos persisten almacenados entre de las diferentes sesiones de navegación. localStorage es similar a <code><a href="/es/docs/Web/API/Window.sessionStorage">sessionStorage</a></code>. La única diferencia es que, mientras los datos almacenados en localStorage no tienen fecha de expiración, los datos almacenados en sessionStorage son eliminados cuando finaliza la sesion de navegación - lo cual ocurre cuando se cierra la página.</p>
<p>Con <code><a href="/es/docs/Web/API/Window.sessionStorage">sessionStorage</a></code> los datos persisten sólo en la ventana/tab que los creó, mientras que con <code>localStorage</code> los datos persisten entre ventanas/tabs con el mismo origen.</p>
<p>Debe tenerse en cuenta que los datos almacenados tanto en <code>localStorage</code> como en <code>sessionStorage</code> <strong>son específicos del protocolo de la página</strong>.</p>
<p>Las claves y los valores son <strong>siempre cadenas de texto</strong> (ten en cuenta que, al igual que con los objetos, las claves de enteros se convertirán automáticamente en cadenas de texto).</p>
<h2 id="Sintaxis">Sintaxis</h2>
<pre class="brush: js">miStorage = window.localStorage;</pre>
<h3 id="Valor">Valor</h3>
<p>Un objeto {{DOMxRef("Storage")}} que se puede utilizar para acceder al espacio de almacenamiento local del origen actual.</p>
<h3 id="Excepciones">Excepciones</h3>
<dl>
<dt><code>SecurityError</code></dt>
<dd>La solicitud viola una decisión de política, o el origen no es <a href="https://developer.mozilla.org/es/docs/Web/Security/Same-origin_politica">una tupla válida de protocolo/host/puerto</a> (esto puede suceder si el origen usa el protocolo <code>file:</code> o <code>data:</code>, por ejemplo). Por ejemplo, el usuario puede tener su navegador configurado a fin de denegar el permiso para conservar datos al origen especificado.</dd>
</dl>
<h2 id="Ejemplo">Ejemplo</h2>
<p>El siguiente código accede al objeto local {{DOMxRef("Storage")}} actual y agrega un ítem al mismo usando {{DOMxRef("Storage.setItem()")}}.</p>
<pre class="brush: js">localStorage.setItem('miGato', 'Juan');</pre>
<div class="note">
<p><strong>Nota</strong>: Por favor ver el articulo <a href="/es/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Usando la Web Storage API</a> para un ejemplo completo.</p>
</div>
<p>La sintaxis para leer el ítem almacenado en <code>localStorage</code> es la siguiente:</p>
<pre class="brush: js">var cat = localStorage.getItem('miGato');</pre>
<p>La sintaxis para eliminar el ítem almacenado en <code>localStorage</code> es la siguiente:</p>
<pre class="brush: js">localStorage.removeItem('miGato');</pre>
<p>La sintaxis para eliminar todos los ítems almacenados en <code>localStorage</code> es la siguiente:</p>
<pre class="brush: js">// Elimina todos los elementos
localStorage.clear();
</pre>
<h2 id="Especificaciones">Especificaciones</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Especificación </th>
<th scope="col">Estado</th>
<th scope="col">Comentario</th>
</tr>
<tr>
<td>{{SpecName('Web Storage', '#dom-localstorage', 'localStorage')}}</td>
<td>{{Spec2('Web Storage')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Compatibiliad_de_Navegadores">Compatibiliad de Navegadores</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Funcionalidad</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>localStorage</td>
<td>4</td>
<td>3.5</td>
<td>8</td>
<td>10.50</td>
<td>4</td>
</tr>
<tr>
<td>sessionStorage</td>
<td>5</td>
<td>2</td>
<td>8</td>
<td>10.50</td>
<td>4</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th><span style="font-family: open sans light,helvetica,arial,sans-serif; font-size: 16px; line-height: 16px;">Funcionalidad</span></th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Phone</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Soporte básico</td>
<td>2.1</td>
<td>{{ CompatUnknown }}</td>
<td>8</td>
<td>11</td>
<td>iOS 3.2</td>
</tr>
</tbody>
</table>
<p>Todos los navegadores tienen variaciones en los niveles de capacidad de almacenamiento tanto para localStorage como para sessionStorage. He aquí un <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">detalle sobre las distintas capacidades en los diferentes navegadores.</a></p>
</div>
<div class="note">
<p><strong>Nota: </strong>a partir de iOS 5.1, Safari Mobile almacena la data del localStorage en el directorio de cache, lo cual esta sujeto al borrado y perdida ocacional de los datos ante la petición del sistema operativo, tipicamente requerido cuando el dispositivo sufre de falta de espacio de almacenamiento.</p>
</div>
<h2 id="Ver_también">Ver también</h2>
<ul>
<li><a href="/es/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Usando la Web Storage API</a></li>
<li><a href="/es/docs/Web/API/Window.sessionStorage">Window.sessionStorage</a></li>
</ul>
|
