由于课程设计的安排，我对H5+css样结合js技术对开发前端项目有了更深的了解。随后又学习ajax的使用方法，下面，我将讲一下我所学到的关于ajax的知识。
一，ajax是什么
全称：asynchronous JavaScript and XML ；（基于XML的异步JavaScript） 通俗的说，就是通过ajax技术将后端的数据拿出来然后在前端页面中显示出来。 也相当于异步的JS和XML，要明确ajax不是一种编程语言，它不需要任何浏览器插件，但需要用户允许JS在浏览器上面执行。
二，ajax的工作流程
三，ajax工作中比较重要的对象
1，XMLHttpRequest 对象
XMLHttpRequest 对象用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
对于大多数浏览器来说均支持 XMLHttpRequest 对象；但也有少部分不支持，如：IE5 和 IE6 则使用 ActiveXObject对象；
（在这里因为基本上很多浏览器都支持XMLHttpRequest ，所以就不在讲解ActiveXObject的使用啦。）
创建 XMLHttpRequest 对象的语法：
variable=new XMLHttpRequest();
创建ActiveXObject对象的语法：
variable=new ActiveXObject("Microsoft.XMLHTTP");
四，ajax向服务器发送请求及相应
请求；
直接上代码啦，，，
xmlhttp.open(method,url,async);
xmlhttp.send();
PS———如下：
代码中：open方法里面三个参数分别是；
method：请求的类型；GET 或 POST
url：文件在服务器上的位置
async：true（异步）或 false（同步）
对于method参数：一般选用get， 只有以下情况才使用post
1.更新服务器上的文件或数据库
2.向服务器发送大量数据的时候
3.发送包含未知字符的用户输入的时候
url：就是你所请求的服务器的链接地址
async：true（异步）或 false（同步）只有这两种情况，所以根据情况选择。
响应；
XMLHttpRequest 对象的两个 responseText 或 responseXML 属性
responseText：获得字符串形式的响应数据。如果服务器的响应不是XML文件的时候所用的响应；
responseXML：获得 XML 形式的响应数据。只有服务器获得XML文件类型的时候所做出的响应；
ajax执行中所涉及的事件
在执行任务的时候会有两个属性：分别是readyState和status
readyState属性会有五个状态的存在，分别是：
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
status属性有两个状态：
200: “OK”
404: 未找到页面
也就是说，当readyState=4和status=200同时成立的时候表示响应已经就绪；
关于ajax重要参数属性基本就这些，下面我分享一下我的课程设计所运用的ajax技术。
初始页面如下：
点击刷新之后的页面如下（所得到的数据是在后台数据库所获取的）
代码解析如下：
详细代码在这儿：
//第一步：创建一个请求对象（负责要数据）
var xhr = new XMLHttpRequest();
//第二步：建立与服务端的连接（找到那个服务器去要数据，我所用到的服务器地址是已经创建好的，并且在服务器里面已经创建好了测试的接口） xhr.open('get','https://mockapi.eolinker.com/2ZhGVxjacb39010e6753bd9c02ee803e6e3bfeab6e8007c/aboutus');
//设置头信息，告诉服务器让数据以表单的形式传递过去
xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
// 第三部：向服务端发送请求
xhr.send();
// 第四部：接收服务端返回的数据
xhr.onreadystatechange = function (){
//xhr.readyState=4代表数据请求完成； xhr.status == 200 代表数据返回成功
if(xhr.readyState=4 && xhr.status == 200){
var responseData = JSON.parse(xhr.responseText);//json串 JSON.parse() 方法用于将一个 JSON 字符串转换为对象。
var sa = responseData.data;
var h3 = document.getElementById("title");
var h4 = document.getElementById("subTitle");
var p = document.getElementById("info");
h3.innerHTML = sa.title;
h4.innerHTML = sa.subTitle;
p.innerHTML = sa.info;