HTML5 is the future of the web. There are so many new and advance features in HTML5. Local Storage is one of them.
Recently I have been working on a mobile application using jquery mobile. In the application I have understand and used the locals
torage() of HTML5. So in this article I will explain about the localstorage() in HTML5. Localstorage is a database used to store the key value pairs of data on the client side i.e in client’s browser.
This means that now you can store your data in your browser. One thing to remember is that the data is stored in the browser not in the computer. If you change your browser say for example Mozilla to chrome you won’t get the same database there, same is the case with the changing computer. The reason is simple because localstorage() is browser specific.
Most browser supports local storage now.
Now lets write some code now.
//The below line of code saves the key value to the database
localStorage.setItem( ‘blog’, ’code insects’ );
document.write(localStorage.getItem(‘blog’)); // print the value of blog i.e code insects.
Now I will write a small code which first creates a database, then creates a table into the databse and stores data in that table.
var shortName = 'db_name';
var version = '1.0';
var displayName = 'db';
var maxSize = 65536;
db = openDatabase(shortName, version, displayName, maxSize);
'CREATE TABLE IF NOT EXISTS table_name ' +
' (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, ' +
' name VARCHAR(150) NOT NULL,' );'
var name =’codeinsects’;
'INSERT INTO table_name (name) VALUES (?);',
The above snippet of the code inserts the data into the table table_name. Similarly to view the data inserted use the select query in the above code as select * from table_name.
So thats all about the localstorage usage in HTML5. You surely will see more posts on the HTML5 very soon.