Dakota Reno

Blog

HTML5 - The Storage Object (JavaScript)

Posted by Dakota Reno on March 27, 2012 at 7:05 PM

HTML5 Storage

Types of Storage:

  • localStorage
  • sessionStorage

window.localStorage

Usage:

var storage = [window.]localStorage;
// To set a property:
storage.replaceMe = setMe;
// or:
storage.setItem(replaceMe, setMe);
// To get a property:
var string = storage.replaceMe;
// or:
var string = storage.getItem(replaceMe);

Reference

Functions:

  • setItem(name, value)
  • getItem(name)
  • removeItem(name)
  • clear()
  • key(value)

Property(ies):

  • length

window.sessionStorage

Usage:

var storage = [window.]localStorage;
// To set a property:
storage.replaceMe = setMe;
// or:
storage.setItem(replaceMe, setMe);
// To get a property:
var string = storage.replaceMe;
// or:
var string = storage.getItem(replaceMe);

Reference

Functions:

  • setItem(name, value)
  • getItem(name)
  • removeItem(name)
  • clear()
  • key(value)

Property(ies):

  • length

Try It!

Source:
var s = window.localStorage; s.clicks = 100; function persistentStorage() { this.set = function(n,v) { if((n!=null)&&(v!=null)) { window.localStorage.setItem(n,v); } }; this.get = function(n) { if(n!=null) { return window.localStorage.getItem(n); } }; this.key = function(n) { if(n!=null) { return window.localStorage.key(n); } }; this.count = window.localStorage.length; this.clear = function() { window.localStorage.clear(); }; this.remove = function(n) { window.localStorage.removeItem(n); }; } //document.getElementById("result").innerText = "Clicks: " + s.clicks; var pS = new persistentStorage(); document.writeln("<b>Clicks: </b>" + s.clicks); pS.set("clicks", 1); document.writeln("<br />"); document.writeln("<b>Clicks: </b>" + s.clicks);
Try It!
Result:
function tryIt() { var txt = document.getElementById("src").value; //eval(txt); var out = '' + txt + ''; var d = result.document; d.open(); d.clear(); d.write(out); d.close(); //document.getElementById("result").innerHTML = out; }

Categories: Programming, Tutorials, "Stuff"

Post a Comment

Oops!

Oops, you forgot something.

Oops!

The words you entered did not match the given text. Please try again.

Already a member? Sign In

0 Comments