CAT | Local Storage
2
HTML5 Local & Session Storage
No comments · Posted by admin in HTML5, Local Storage, Session Storage
This is a nice and clean example of HTML5 Local and Session storage. Remember how I described Local Storage in an earlier post.
HTML5 Local Storage, similar to HTTP session cookies, is for storing structured data on the client side. It consists of key value pairs that can be stored and retrieved from the browser. The API is extremely straight forward and basically consists of 4 main methods:
- setItem(key, value)
- getItem(key)
- removeItem(key)
- clear()
Local Storage and Session storage have the same basic API. The only difference is that Session storage is tied to the life of the session. Which means until you close the window or browser. Local Storage is stored indefinitely.
HTML5 Local Storage, similar to HTTP session cookies, is for storing structured data on the client side. It consists of key value pairs that can be stored and retrieved from the browser. The API is extremely straight forward and basically consists of 4 main methods:
- setItem(key, value)
- getItem(key)
- removeItem(key)
- clear()
These methods do exactly what you think they would do. To set something to the browsers Local Storage simply do this:
var key = “foo”;
var value = “bar”;
localStorage.setItem(key, value);
To retrieve the value and print it to the screen with jQuery try this:
var key = $(“#form”).val();
var value = localStorage.getItem(key);
$(“div#output”).html(“<p>The key is:” + key + ” and the value is:” + value +”</p>”);
To see HTML5 Local Storage in action check out this great example from Mike Smith at the W3C:
No tags
