AJAX小结

一、AJAX是什么

AJAX是Asynchronnous JavaScript And XML的缩写，由 HTML、JavaScript技术、DHTML 和 DOM 组成。

HTML用于建立Web表单并确定应用程序其他部分使用的字段；

JavaScript 代码是运行 Ajax应用程序的核心代码，建立应用程序与服务器的通信；

DHTML 或 DynamicHTML，用于动态更新表单。使用 div、span 和其他动态 HTML 元素来标记 HTML；

DOM 文档对象模型用于处理 HTML 结构和服务器返回的 XML。

二、异步交互

传统的web交互方式是同步的，即用户向HTTP服务器提交一个处理请求。接着，服务器端接收到请求后，进行处理，比如和数据库服务器进行数据信息交换。最后，服务器对请求进行响应，将结果返回给客户端，返回一个HTML在浏览器中显示，通常会有CSS样式丰富页面的显示效果。这是一条线的过程，用户要等待服务器的响应、处理、返回，等待过程中，页面显示的内容只能是空白。

传统的web同步交互示意图：

AJAX实现了异步交互、动态交互，首先要明白AJAX是属于JavaScript的一种技术。当用户填写表单时，JavaScript 代码捕获表单数据，用AJAX向服务器发送请求。同时用户屏幕上的表单也不会闪烁、消失或延迟。换句话说，JavaScript代码在幕后发送请求，用户甚至不知道请求的发出。也可以说，请求是异步发送的， 用户不用等待服务器的响应，可以继续输入数据、滚动屏幕和使用应用程序。

AJAX异步交互方式示意图：

三、知识点

我把AJAX大概划了三大块：

1、XMLHttpRequest对象是AJAX的核心技术，尤其是解决浏览器兼容性、跨域访问的问题。因为各家浏览器不能达成统一，所以在不同浏览器获得XMLHttpRequest对象需要采用不同的方法：

<span style="font-size:18px;">/*支持多种浏览器的方式创建 XMLHttpRequest 对象 */
var xmlHttp = false;
try {
  xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
  try {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  } catch (e2) {
    xmlHttp = false;
  }
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
  xmlHttp = new XMLHttpRequest();
}
</span>

2、Dom文档对象模型

HTML是一种文本标记语言，浏览器页面，是由HTML标记文本、CSS样式、JavaScript代码合力组成。CSS和JavaScript通常位于外部文件，浏览器和服务器交互时，是如何将事件、样式映射到文本标记的呢？这就是DOM树的作用了。

关于XML的理解还不成熟，请大家补充。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!