onclick function is not working inside script tag

Question

<section id="main">

     <button class='btn' onclick="deleteNote()" type="button">Delete</button>
  </section>


<script type="module">

import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.6.11/firebase-app.js'
import { 
    getDatabase, ref, child, get, onValue, onChildAdded, onChildChanged, onChildRemoved,push,set,remove
} from 'https://www.gstatic.com/firebasejs/9.6.11/firebase-database.js';



   // Initialize Firebase
   const app = initializeApp(firebaseConfig);

    const db = getDatabase();

    function deleteNote(){
          // console.log(key);
          console.log('deleting');
         
}

Why the onclick is not working? But when I define the function inside different script tag it works.

Answer 1

Inside the Script tag, you have to call the function to execute it

function deleteNote(){
     // console.log(key);
     console.log('deleting');
         
}
deleteNote();

And if you are using it on any HTML page don't forget to import the script or use the script on the same page and check your browsers support the module value read more