AJAX

在 Web 的早期，一切都很简单——一个页面就是文本，可能有样式，并且包含指向其他页面的链接。要获取新内容，您需要从一页转到另一页。但随着开发人员对 Web 的野心越来越大，试图构建交互式（“类似原生”）应用程序，显然需要一种方法来在不完全重新加载的情况下将新内容加载到页面中。

要为页面检索新内容，例如无限滚动网站上的新文章或通知您新电子邮件，会使用一种称为XML HTTP Request (XHR) 的工具。执行此操作的 Web 应用程序也称为AJAX 应用程序，AJAX 代表Asynchronous JavaScript and XML（异步 JavaScript 和 XML）。

几乎所有在不重新加载页面的情况下获取新内容的网站（例如 Facebook、Gmail、Google Maps 等）都使用相同的技术。事实上，最初创建 XMLHttpRequest 的是 Microsoft 开发的 Outlook Web Access。

XML HTTP Request

那么 XMLHttpRequest 看起来是怎样的呢？


var req = new XMLHttpRequest();
req.onload = function (event) { . . . };
req.open('get', 'some-file.txt', true);
req.send();

首先要做的是使用 new 关键字创建一个新的 XMLHttpRequest 请求，并像调用函数一样调用 XMLHttpRequest。

然后我们指定一个回调函数，在数据加载时调用它。它将有关事件的信息作为第一个参数传递。

然后我们使用 req.open 指定如何获取所需数据。第一个参数是 HTTP 方法（GET、POST、PUT 等）。下一个是要从中获取的 URL - 这类似于链接的 href 属性。

第三个是一个布尔值，指定请求是否为异步——这里我们设置为 true，因此 XMLHttpRequest 会被触发，然后代码执行会继续，直到服务器的响应导致 onload 回调被触发。

异步参数默认为 false——如果为 false，代码的执行将在此行暂停，直到检索到数据并调用请求为同步。同步的 XMLHttpRequests 不常使用，因为对服务器的请求可能需要很长时间。这对于浏览器什么都不做来说是很长的时间。

在最后一行，我们告诉浏览器触发数据请求。

AJAX 和库

AJAX 技术已经发展到可以实现单页应用程序的程度——一个主要的请求加载 JavaScript 代码，然后该代码会异步地从服务器加载其他内容。已经构建了整个库和框架来帮助实现这一点，我们稍后将对此进行介绍。