Saturday, November 16, 2024
Google search engine
HomeLanguagesJavascriptHTML DOM indexedDB open() Method

HTML DOM indexedDB open() Method

The open() method of the indexedDB interface requests opening a connection to a database. This method returns an IDBOpenDBRequest object immediately and performs the open operation asynchronously.

Syntax:

var IDBOpenDBRequest = indexedDB.open(name);
// Or
var IDBOpenDBRequest = indexedDB.open(name, version);

Parameters:  This method accepts two parameters as mentioned above and described below:

  • name: The name of the database to be opened.
  • version (Optional): The version to open the database with.

Return value: This method returns a IDBOpenDBRequest object.

Example: In this example, we will open a database named “toDoList” using this method.

HTML




<!DOCTYPE html>
<html>
<head>
    <title>indexedDB open() method</title>
</head>
<body style="text-align: center;">
    <h1 style="color: green;">
        neveropen
    </h1>
  
    <p>
        HTML | indexedDB open() method
    </p>
  
    <button onclick="Geeks()">
        Click Here
    </button>
    <p id="a"></p>
  
    <script>
    var a = document.getElementById("a");
    function Geeks() {
        window.indexedDB = window.indexedDB || 
                           window.mozIndexedDB ||
                           window.webkitIndexedDB ||
                           window.msIndexedDB
        window.IDBTransaction = window.IDBTransaction || 
                                window.webkitIDBTransaction || 
                                window.msIDBTransaction;
        window.IDBKeyRange = window.IDBKeyRange || 
                             window.webkitIDBKeyRange ||
                             window.msIDBKeyRange
        var DBOpen = window.indexedDB.open("toDoList", 4);
  
        DBOpen.onerror = function (event) {
            a.innerHTML += "<li>Error loading database.</li>";
        };
  
        DBOpen.onsuccess = function (event) {
            a.innerHTML += "<li>Database initialised.</li>";
            console.log(DBOpen);
            console.log(window.indexedDB.databases());
        };
    }
    </script>
</body>
</html>


Output:

Before Button Click:

After Button Click: In the console, IDBOpenDBRequest object can be seen along with database “toDoList” in databases array

Supported Browsers: 

  • Google Chrome
  • Edge
  • Firefox
  • Safari
  • Opera
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!

RELATED ARTICLES

Most Popular

Recent Comments