aboutsummaryrefslogtreecommitdiff
path: root/files/nl/web/api/window/sessionstorage/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/nl/web/api/window/sessionstorage/index.html')
-rw-r--r--files/nl/web/api/window/sessionstorage/index.html148
1 files changed, 148 insertions, 0 deletions
diff --git a/files/nl/web/api/window/sessionstorage/index.html b/files/nl/web/api/window/sessionstorage/index.html
new file mode 100644
index 0000000000..0a62084a19
--- /dev/null
+++ b/files/nl/web/api/window/sessionstorage/index.html
@@ -0,0 +1,148 @@
+---
+title: Window.sessionStorage
+slug: Web/API/Window/sessionStorage
+tags:
+ - API
+ - Referentie
+ - eigenschap
+ - opslag
+ - sessie opslag
+translation_of: Web/API/Window/sessionStorage
+---
+<p>{{APIRef()}}</p>
+
+<p>De <code>sessionStorage</code> eigenschap stelt je in staat toegang te krijgen tot het {{domxref("Storage")}} object. sessionStorage lijkt sterk op {{domxref("Window.localStorage")}}, het enige verschil is dat data opgeslagen in localStorage geen vervaltijd heeft, waarbij sessionStorage vervalt als de sessie van de pagina vervalt. Een pagina sessie duurt zo lang de browser open is en overleeft acties als vernieuwen. <strong>Het openen van een pagina in een nieuw tabblad of window zorgt voor een nieuwe sessie</strong>, wat dus anders is dan hoe sessie-cookies werken. </p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="brush: js">// Sla data op in sessionStorage
+sessionStorage.setItem('key', 'value');
+
+// Vraag opgeslagen data op uit sessionStorage
+var data = sessionStorage.getItem('key');
+
+// Verwijder opgeslagen data uit sessionStorage
+sessionStorage.removeItem('key')
+</pre>
+
+<h3 id="Waarde">Waarde</h3>
+
+<p>Een {{domxref("Storage")}} object.</p>
+
+<h2 id="Voorbeeld">Voorbeeld</h2>
+
+<p>Het volgende stukje code slaat data op in de sessie van het huidige domein door {{domxref("Storage.setItem()")}} aan te roepen op {{domxref("Storage")}}.</p>
+
+<pre class="brush: js">sessionStorage.setItem('mijnKat', 'Tom');</pre>
+
+<p>Het volgende voorbeeld slaat automatisch de inhoud van een text veld op en als de browser per ongeluk herladen wordt zal de text herstelt worden en is er niks verloren gegaan.</p>
+
+<pre class="brush: js">// Zoek het veld wat je wilt bewaren in de sessie
+var field = document.getElementById("field");
+
+// Kijk eerst of we een 'autosave' waarde hebben
+// (dit gebeurt alleen als je per ongeluk ververst)
+if (sessionStorage.getItem("autosave")) {
+ // Herstel de inhoud van het veld
+ field.value = sessionStorage.getItem("autosave");
+}
+
+// Luister naar wijzigingen in het veld
+field.addEventListener("change", function() {
+ // Sla het resultaat op in de sessionStorage
+ sessionStorage.setItem("autosave", field.value);
+});</pre>
+
+
+
+<div class="note">
+<p><strong>Note</strong>: Please refer to the <a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a> article for a full example.</p>
+</div>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Specification</th>
+ <th scope="col">Status</th>
+ <th scope="col">Comment</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('Web Storage', '#the-sessionstorage-attribute', 'sessionStorage')}}</td>
+ <td>{{Spec2('Web Storage')}}</td>
+ <td></td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Feature</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>Feature</th>
+ <th>Android</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>IE Phone</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>2.1</td>
+ <td>{{ CompatUnknown }}</td>
+ <td>8</td>
+ <td>11</td>
+ <td>iOS 3.2</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<p>All browsers have varying capacity levels for both localStorage and sessionStorage. Here is a <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">detailed rundown of all the storage capacities for various browsers</a>.</p>
+
+<div class="note">
+<p><strong>Note: </strong>since iOS 5.1, Safari Mobile stores localStorage data in the cache folder, which is subject to occasional clean up, at the behest of the OS, typically if space is short.</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li>
+ <li>{{domxref("Window.localStorage")}}</li>
+</ul>