Scripting and Applications - Web Standards: Mastering HTML5, CSS3, and XML - page 206

<p>
Enter name to retrieve value:
<input name="retrieve">
<input type="button" value="Get value" onclick="getTheItem()">
</p>
<script type="text/javascript">
function setTheItem() {
var name = document.forms.lsform.name.value;
var data = document.forms.lsform.data.value;
localStorage.setItem(name, data);
displayItems();
}
function getTheItem() {
var name = document.forms.lsform.retrieve.value;
window.alert('The value associated with the name ' + name + ' is ' + 
localStorage.getItem(name));
displayItems();
}
function removeTheItem() {
var name = document.forms.lsform.remove.value;
document.forms.lsform.data.value = localStorage.removeItem(name);
displayItems();
}
function clearItems() {
localStorage.clear();
displayItems();
}
function displayItems() {
var key = "";
var pairs = "<tr><th>Name</th><th>Value</th></tr>\n";
var i = 0;
for (i = 0; i <= localStorage.length-1; i++) {
key = localStorage.key(i);
pairs += "<tr><td>" + key + "</td>\n<td>" + localStorage.getItem(key) + 
"</td></tr>\n";
}
if (pairs == "<tr><th>Name</th><th>Value</th></tr>\n") {
pairs += "<tr><td><em>&lt;not set&gt;</em></td>\n<td><em>&lt;not 
set&gt;</em></td></tr>\n";
}
document.getElementById('pairs').innerHTML = pairs;
}
</script>
</fieldset>
</form>
The Web Storage API is supported by IE 8+, Firefox 3.5+, Google Chrome 4+ ( sessionStorage from 5+), Safari 4+,
and Opera 10.50+.