AJAX简单回顾-1

持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第10天，点击查看活动详情

前言

兄弟们，今天明明是星期二，但是很多JYM都开始疯狂星期四了，这可不太对劲哦！还是要认清现实，该摸鱼还得照常摸哈哈哈

好久没写前端代码了，简单回顾一下AJAX相关的小知识吧~

简介

AJAX是 Asynchronous JavaScript And XML，一种基于JavaScript 和 XML（JSON）的，能够在不重新加载整个网页的情况下，更新部分网页内容的技术；

即：

• AJAX = 异步 JavaScript 和 XML ( JSON )

• AJAX 是一种用于创建快速动态网页的技术

• 通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。

  这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。而传统的不使用AJAX的网页如果需要更新内容，则必须重载整个网页。

AJAX 原理图示

AJAX 使用的技术有

1. XMLHttpRequest 对象 用于异步的与服务器交换数据
2. JavaScript/DOM 用于信息显示/交互
3. CSS 用于给数据定义样式
4. XML / JSON 用于与服务器端交换数据的格式

AJAX 是平台无关的

只要是现代的浏览器，都支持 AJAX 技术，而不论是 Mac OS 上的 Chrome 还是 Safari 还是 Firefox

创建 XMLHttpRequest 对象

XMLHttpRequest 是 AJAX 的基础，用于异步地与服务器交换数据；所有的现代浏览器都支持；（IE6比较特殊，它使用ActiveXObject)

可以使用如下语法创建 XMLHttpRequest 对象

*variable* = new XMLHttpRequest();

老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象

 *variable* = new ActiveXObject("Microsoft.XMLHTTP");

兼容的语法如下

为了兼容 IE6+ 浏览器，就用if-else，先判断浏览器是否支持XMLHttpRequest对象，支持的话则创建上述对象，不支持的话则创建ActiveXObject对象；

代码如下所示

var xmlhttp;

if (window.XMLHttpRequest)
{
    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
    xmlhttp = new XMLHttpRequest();
} else {

    // IE6, IE5 浏览器执行代码
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

总结

创建完XMLHttpRequest对象，接下来就是如何发送服务器请求，内容相对比较丰富，我们下篇文章继续~