Ads by Google

Manage HTML5 Web Storage using jQuery

HTML5 Web Storage Creative BlogHTML5 Storage is based on named key/value pairs. You store data based on a named key, then you can retrieve that data with the same key. The named key is a string. The data can be any type supported by JavaScript, including strings, Booleans, integers, or floats. However, the data is actually stored as a string.

NOTE: If you are storing and retrieving anything other than strings, you will need to use functions like parseInt() or parseFloat() to coerce your retrieved data into the expected JavaScript datatype.

Which browsers? Well, the latest version of pretty much every browser supports HTML5 Storage… even Internet Explorer!

HTML5 Storage support
IE Firefox Safari Chrome Opera iPhone Android
8.0+ 3.5+ 4.0+ 4.0+ 10.5+ 2.0+ 2.0+

From your JavaScript code, you’ll access HTML5 Storage through the localStorage object on the global window object.

As relief, we made for you one jQuery plugin what helps you to use this Web Storage.


When you copy this plugin into your project remains only to use it.

$.storage(name[key], value[string]);


This is the simplest example of the usage for our Web Storage plugin.

ATTENTION: Checking the Browsers Web Storage support is embedded within the plugin and it will automatically alert you if the browser does not support Web Storage. But you also have the option to check and add other functions as well.

The short lesson what is HTML Local Storage

With local storage, web applications can store data locally within the user’s browser.

Before HTML5, application data had to be stored in cookies, included in every server request. Local storage is more secure, and large amounts of data can be stored locally, without affecting website performance.

Unlike cookies, the storage limit is far larger (at least 5MB) and information is never transferred to the server.

Local storage is per domain. All pages, from one domain, can store and access the same data.