AJAX stands for **Asynchronous JavaScript and XML**. It is a technique for creating fast and dynamic web pages. AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.
The flow of an AJAX request looks like this:
Let's say we have a PHP file that returns a greeting. We can call it using JavaScript's fetch() API.
<?php
$name = $_GET['name'];
echo "Hello, " . htmlspecialchars($name) . "! The time is " . date("H:i:s");
?>
async function showGreeting() {
let response = await fetch('get_hint.php?name=John');
let data = await response.text();
document.getElementById("display").innerHTML = data;
}
showGreeting() is called, the browser asks get_hint.php for information. PHP runs, generates the string, and sends it back. JavaScript then puts that string inside an HTML element.
Although the "X" in AJAX stands for XML, modern web development almost always uses **JSON** instead. JSON is smaller, faster to parse, and works natively with JavaScript arrays and objects. In the next lessons, we'll focus on sending JSON data from PHP to AJAX.
While AJAX often uses JSON, some legacy systems still use XML. Let's briefly look at how PHP handles **XML** data in the next lesson.