什么是Ajax（Ajax的来历、运行原理、优缺点及其它）

这里是修真院web小课堂，每篇分享文从

【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】

八个方面深度解析web知识/技能，本篇分享的是：

【什么是Ajax（Ajax的来历、运行原理、优缺点及其它）】

大家好，我是IT修真院深圳分院第3期的学员，一枚正直纯洁善良的前端程序员，今天给大家分享一下，修真院官网前端工程师深度思考中的知识点——什么是Ajax

 

---

一.背景介绍

 

Ajax的来历

套用一句不恰当的话，Ajax就是中间商（并不赚取差价），换一个专业点的说话，现在它就是脚本发起HTTP通信的代名词

具体什么是Ajax呢？我们在说这个问题之前，需要思考一个问题：当我们上网的时候，我们到底在上什么？

大部分人都是在上浏览器。

当我们在浏览器地址栏键入一个网址，或者通过网页表单向服务器提交内容的时候,我们就开始与浏览器进行交互。而浏览器在这个时候，开始与服务器进行交互。

传统的Web应用交互由用户触发一个HTTP请求到服务器,服务器对其进行处理后再返回一个新的HTML页到客户端。

每当服务器处理客户端提交的请求时,客户都只能空闲等待,并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据

都要返回一个完整的HTML页,而客户端每次都要浪费时间和带宽去重新读取整个页面。

1999年，微软公司发布IE浏览器5.0版，第一次引入新功能：允许JavaScript脚本向服务器发起HTTP请求。这个功能当时并没有引起注意,为什么？

实际上，人们一直在寻求改善传统的web应用交互方式。1999年以前，JS可以通过Java applet或Flash电影等中间层向服务器发送请求。

在Ajax被提出之前，这种技术就已经存在很长时间了，那时候人们通常将这种技术叫做远程脚本(remote scripting)

Ajax技术的核心是XMLHttpRequest（简称XHR），这是由微软首先引入的一个特性，最早应用在它的IE5浏览器上。

在IE5中，XHR对象是通过MSXML库中的一个ActiveX对象实现的，而IE7+及其他标准浏览器都支持原生的XHR对象

在XHR出现之前，Ajax式的通信必须借助一些hack首选来实现，大多数使用隐藏或内嵌的框架来。

在XHR出现之后，XHR为向浏览器发送请求和解析服务器响应提供了流畅的接口。

随着XHR、JS等各项技术应用得越来越广泛，2005年，依赖XHR的Ajax技术被提出

 

 

浏览器与服务器交互图例

 

 

---

二.知识剖析

1、运行机制

2、代码示例

3、优缺点

1、运行机制

先看一下Ajax的英文翻译

AJAX stands for Asynchronous JavaScript and XML.

AJAX is a new technique for creating better, faster, and more interactive web applications with the help of XML, HTML, CSS, and Java Script.

AJAX is based on the following open standards:

Browser-based presentation using HTML and Cascading Style Sheets (CSS).

Data is stored in XML format and fetched from the server.

Behind-the-scenes data fetches using XMLHttpRequest objects in the browser.

JavaScript to make everything happen.

从上可以看出Ajax依赖CSS/HTML/Javascript，而其中最核心的依赖是浏览器提供的XMLHttpRequest简称（XHR）对象，是这个对象使得浏览器可以发出HTTP请求与接收HTTP

响应。

W3C形象的称XHR对象是开发者的梦想

Ajax的工作原理相当于在用户和服务器之间加了—个中间层(AJAX引擎),使用户操作与服务器响应异步化。

并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做, 只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。

Ajax就这样集齐CSS、JavaScript、XMLHTTPRequest、DOM对象四神兽，通过XmlHttpRequest

对象来向服务器发异步请求，从服务器获得数据，然后用JavaScript来操作DOM、改变CSS，更新页面。

Ajax重要影响是使WEB中的界面与应用分离&#