Nearby lessons

19 of 22

JavaScript: AJAX (XMLHttpRequest)

📌 What is AJAX?

AJAX (Asynchronous JavaScript and XML) allows web pages to be updated asynchronously by exchanging data with a web server behind the scenes. In JavaScript, the XMLHttpRequest object is used to interact with servers.

1️⃣ Load Local File (Success)

This example loads content from a local readme.txt file and displays it when the request is successful (status 200).

Example02
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

2️⃣ Handle 404 Error (File Not Found)

This example displays an error message if the file does not exist (status 404).

Example03
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

3️⃣ Load JSON from API (Console Output)

This example fetches data from a public API and logs the JSON response in the browser console.

Example04
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

4️⃣ Display API Data in Browser

This example parses JSON from an API and displays the post titles in a list format on the webpage.

Example05
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output

5️⃣ POST Data to API

This example sends JSON data to a public API using POST and logs the response in the console.

Example06
🚀Code Cell
Loading Editor...
✏️ You can edit this code — click Run to refresh the preview.
Output