HTML5 Web Storage

HTML5 Web Storage, a better local storage method than a cookie.

What is HTML5 Web storage?

Use HTML5 to store the user's browsing data locally.

Earlier, local storage was using cookies. But Web storage needs to be more secure and fast. This data is not saved on the server, but it is used only for user requests for Web site data. It can also store large amounts of data without compromising the performance of the site.

Data exists as a key/value pair, and the Web page's data is only allowed to be used by that page.

Browser support

Internet Explorer 8+, Firefox, Opera, Chrome, and Safari support Web Storage.

Note: Internet Explorer 7 and earlier versions of IE do not support Web storage.

Localstorage and Sessionstorage

There is the new objects for storing data on the client:

• Localstorage-Data storage with no time limit
• Sessionstorage-Data storage for a session

Before using Web Storage, you should check whether your browser supports localstorage and sessionstorage:

if (typeof (Storage)!== "undefined") {  //yes! localstorage and Sessionstorage support!  Some code ...} else{  //sorry! No Web Storage Support:}

Localstorage Object

The data stored by the Localstorage object has no time limit. Data is still available after the second, second, or next year.

<Script>functionClickCounter () {if(typeof(Storage)!=="undefined")  {  if(localstorage.clickcount) {Localstorage.clickcount=Number (Localstorage.clickcount)+1; }  Else{Localstorage.clickcount=1; } document.getElementById ("result"). InnerHTML="You have clicked the button" +Localstorage.clickcount+ "Time (s)."; }Else{document.getElementById ("result"). InnerHTML="Sorry, your browser does not support Web Storage ..."; }}</Script>

Sessionstorage Object

The Sessionstorage method stores data for a session. When the user closes the browser window, the data is deleted.

How to create and access a sessionstorage:

<Script>functionClickCounter () {if(typeof(Storage)!=="undefined")  {  if(sessionstorage.clickcount) {Sessionstorage.clickcount=Number (Sessionstorage.clickcount)+1; }  Else{Sessionstorage.clickcount=1; } document.getElementById ("result"). InnerHTML="You have clicked the button" +Sessionstorage.clickcount+ "Time (s) in the this session."; }Else{document.getElementById ("result"). InnerHTML="Sorry, your browser does not support Web Storage ..."; }}</Script>

HTML5 Web Storage