HTML 页面包含一个 <div> 部分和一个 <button>。
<div> 部分用于显示来自服务器的信息。
<button> 调用一个函数(如果单击它)。
该函数从 Web 服务器请求数据并显示它:
函数loadDoc()
function loadDoc() {
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
document.getElementById(“demo”).innerHTML = this.responseText;
}
xhttp.open(“GET”, “ajax_info.txt”, true);
xhttp.send();
}
什么是 AJAX?
AJAX =同步JavaScript和XML 。_ _
AJAX 不是一种编程语言。
AJAX 仅使用以下组合:
- 浏览器内置XMLHttpRequest对象(从 Web 服务器请求数据)
- JavaScript 和 HTML DOM(用于显示或使用数据)
AJAX 是一个误导性的名称。AJAX 应用程序可能使用 XML 来传输数据,但以纯文本或 JSON 文本传输数据也同样常见。
AJAX 允许通过在后台与 Web 服务器交换数据来异步更新网页。这意味着可以更新网页的部分内容,而无需重新加载整个页面。
AJAX 的工作原理
- 网页中发生事件(页面被加载,按钮被点击)
- JavaScript 创建 XMLHttpRequest 对象
- XMLHttpRequest对象向Web服务器发送请求
- 服务器处理请求
- 服务器将响应发送回网页
- JavaScript 读取响应
- 正确的操作(如页面更新)由 JavaScript 执行