• +91-9142290450

  • Hajipur, Bihar, 844101

☰
❮
❯

HTML Web APIs

← Previous Next →

Web APIs (Application Programming Interfaces) are built-in browser interfaces that allow web developers to interact with the browser, the user’s environment, or external services using JavaScript. These APIs are not part of HTML itself but are often used alongside HTML to create interactive web applications.

🔹 Commonly Used HTML Web APIs

Web API Description
DOM API Allows manipulation of HTML elements and content
Fetch API Used to make HTTP requests (GET, POST, etc.)
Geolocation API Gets the user’s geographical location
Local Storage Stores data in the browser that persists after reload
Session Storage Stores data per tab session
Canvas API Draws graphics using JavaScript
Audio/Video API Controls playback of media elements
Clipboard API Allows copying and pasting to/from the clipboard
Notification API Displays desktop notifications

💻 Examples

✅ DOM API
document.getElementById("demo").innerText = "Hello API!";
✅ Fetch API
fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => console.log(data));
✅ Geolocation API
navigator.geolocation.getCurrentPosition(function(position) {
  console.log("Latitude: " + position.coords.latitude);
});
✅ Local Storage
localStorage.setItem("username", "Bikki");
let name = localStorage.getItem("username");
✅ Clipboard API
navigator.clipboard.writeText("Copied text!");

Practice Questions

Q1. Use DOM API to change the text of an HTML element with ID title.

Q2. Create a button that fetches user data using fetch() from a dummy API.

Q3. Store the user's name in localStorage and retrieve it on page load.

Q4. Use navigator.geolocation to get user location and display it.

Q5. Copy a message to clipboard using the Clipboard API.

Q6. Store a theme color in sessionStorage and apply it on page load.

Q7. Use Fetch API to POST data to an API endpoint.

Q8. Display a browser notification using the Notification API.

Q9. Draw something on <canvas> using the Canvas API.

Q10. Play an audio file using the HTML Audio API and control playback.

← Previous Next →

HTML

online coding class codepractice

HTML5 Basics

HTML Styling and Design

HTML Links and Media

HTML Layout and Structure

HTML Forms

HTML Graphics

HTML APIs

HTML Advanced Topics

codepractice logo
Login
Go Back Top