HTML IndexedDB

❮ PrevNext ❯

What is IndexedDB?

The IndexedDB is otherwise called as Indexed Database is a JavaScript API provided by web browsers for managing a NoSQL database of JSON objects.

The IndexedDB is a standard maintained by the World Wide Web Consortium (W3C).

How to view IndexedDB?

Follow the below steps to view your data stored in the IndexedDB:

  1. Go to Developer Tools or Press F12 or Press Ctrl + Shift + i.
  2. Switch to Application Tab on the top navigation bar.
  3. On the left side menu you will find the IndexedDB.

Note: If you couldn't find your recent changes in the IndexedDB, close and reopen the developer tools to see the changes.

Size Limitation

You can use up to 5MB on mobile, 50MB on desktop for free. However, the user can allow the limit to be removed by granting permission.

In the following example, we will create a table ('MyTableName') under the database ('MyDatabase').

Example

HTML Online Editor
<!DOCTYPE html> <html> <body> <script> var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB || window.shimIndexedDB; // Open (or create) the database var open = indexedDB.open("MyDatabase", 1); open.onupgradeneeded = function() { var db = open.result; var store = db.createObjectStore("MyTableName", {keyPath: "id"}); var index = store.createIndex("NameIndex", ["name.last", "name.first"]); alert("Indexed Table Created Successfully"); }; </script> </body> </html>
Run

Reminder

Hi Developers, we almost covered 99.5% of HTML Tutorials with examples for quick and easy learning.

We are working to cover every Single Concept in HTML.

Please do google search for:

Join Our Channel

Join our telegram channel to get an instant update on depreciation and new features on HTML, CSS, JavaScript, jQuery, Node.js, PHP and Python.

This channel is primarily useful for Full Stack Web Developer.

Meet the Author