10
10
DOCTYPE html>
<html>
<head>
<title>AJAX Demonstration</title>
<style>
body { font-family: Arial, sans-serif; margin: 20px; }
h3 { color: navy; }
pre { background: #f4f4f4; padding: 10px; border: 1px solid #ddd; }
</style>
<!-- Load jQuery -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<h1>AJAX Demonstration</h1>
<script>
// a. AJAX without jQuery
function loadTextFile() {
const xhr = new XMLHttpRequest();
xhr.open("GET", "sample.txt", true);
xhr.onload = function () {
if (xhr.status === 200) {
document.getElementById('output1').innerText =
xhr.responseText;
} else {
document.getElementById('output1').innerText = "Error loading
file.";
}
};
xhr.send();
}