HTML5 web storage is a local storage in client environment and it is a better than cookies. Unlike the cookie storage limitation of 4KB, we can store up to 10 megabytes in HTML5 local storage.
1. Web storage is the most secured and faster way of storing information in client environment.
2. The data is not included with every server request, but well be sent to server only when requested by server.
3. Using web storage it is also possible to store large amounts of data upto 10MB on client machine, without affecting the website’s performance.
Web storage is supported by almost all the major browsers like Internet Explorer 8+, Firefox, Opera, Chrome, and Safari etc.
Local Storage
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script>
if(localStorage)
{
document.write('Local storage are supprted');
} else {
document.write('Local storage are not supprted');
}
function storedata()
{
localStorage.username = document.getElementById('txt_username').value;
}
function getlocalstorage()
{
if(localStorage.username)
{
document.getElementById('span1').innerHTML = localStorage.username;
}
}
</script>
</head>
<body onload="getlocalstorage()">
<input type="text" id="txt_username" name="username" value=" " />
<input type="button" onclick="storedata()" name="name" value="Store UserName" />
<span id="span1"></span>
</body>
</html>
Session Storage
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script>
function storedata()
{
sessionStorage.setItem('uname', document.getElementById('txt_username').value);
}
function getdata() {
document.getElementById('span1').innerHTML = sessionStorage.getItem('uname');
}
</script>
</head>
<body>
<input type="text" id="txt_username" name="username" value=" " />
<input type="button" onclick="storedata()" name="name" value="Store UserName" />
<input type="button" onclick="getdata()" name="name" value="Get UserName" />
<span id="span1"></span>
</body>
</html>
I like what you guys are up too. Such clever work and reporting!
Keep up the awesome works guys I’ve incorporated you guys to our blogroll.