About Local Storage

Introducing HTML5 Storage

var foo = localStorage.getItem("bar");
// ...
localStorage.setItem("bar", foo);
…could be rewritten to use square bracket syntax instead:

var foo = localStorage["bar"];
// ...
localStorage["bar"] = foo;

TRACKING CHANGES TO THE HTML5 STORAGE AREA


if (window.addEventListener) {
  window.addEventListener("storage", handle_storage, false);
} else {
  window.attachEvent("onstorage", handle_storage);
};

Tracking changes

To track changes you can trap the storage event; whenever the setItem(), removeItem() or clear() are called and actually change something the storage event is fired. The storage event is supported everywhere the localStorage object is supported, therefore, to hook the storage event, you’ll need to check which event mechanism the browser supports. The handle_storage callback function will be called with a StorageEvent object, at this point, the variable will be a StorageEvent object.

StorageEvent object properties


Table Of Content