HTML-5 Local Storage making it work.

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.

//create db
 
var shortName = 'db_name';
 
var version = '1.0';
 
var displayName = 'db';
 
var maxSize = 65536;
 
db = openDatabase(shortName, version, displayName, maxSize);
 
db.transaction(
 
     function(transaction) {
 
         transaction.executeSql(
 
            'CREATE TABLE IF NOT EXISTS table_name ' +
 
            ' (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, ' +
 
            ' name VARCHAR(150) NOT NULL,' );'
 
        );
 
     }
);
 
  var name =’codeinsects’;
 
  db.transaction(
 
        function(transaction) {
 
            transaction.executeSql(
 
                'INSERT INTO table_name (name) VALUES (?);',
 
               [name]
 
          );
      }
);

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.

Comments
  1. Nimesh MEhra
    • Stretch
  2. admin
    • Midge
  3. ona
    • admin
      • Jakayla
  4. Chapple
    • Etta
  5. Micheal
  6. Jaylene
  7. Poul
  8. cruises from baltimore
  9. Earl
  10. Porcher
  11. Seo Content Writers
  12. jquery google api

Leave a Reply

Your email address will not be published. Required fields are marked *

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.


Skip to toolbar