Handling Server Responses and Updating the Webpage

📥 Handling Ajax Responses

Once an Ajax request is completed, handling the server response correctly is crucial to ensure a smooth user experience. Common response formats include JSON, XML, HTML, and plain text.

🧪 Example: Updating Content with JSON Data

fetch('api/data')
  .then(response => response.json())
  .then(data => {
    document.getElementById('result').innerHTML = `User: ${data.name}, Age: ${data.age}`;
  });

📄 Handling Different Data Types

| 🗂️ Format     | 📌 Usage                                                             |
|---------------|----------------------------------------------------------------------|
| 🧾 JSON       | Typical for data exchange; parsed into JavaScript objects            |
| 🧬 XML        | Used in legacy systems; parsed with DOM parsers                      |
| 🧱 HTML       | Directly inject into DOM as `innerHTML`                              |
| 📝 Plain Text | For simple messages or logs                                          |

🛡️ Proper parsing and validation are essential, especially with JSON and XML, to prevent security issues like XSS or malformed data errors.