什么是ajax
ajax的出现,刚好解决了传统方法的缺陷。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
传统方法的缺点:
传统的web交互是用户触发一个http请求服务器,然后服务器收到之后,在做出响应到用户,并且返回一个新的页面,,每当服务器处理客户端提交的请求时,客户都只能空闲等待,并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据,都要返回一个完整的HTML页,而用户每次都要浪费时间和带宽去重新读取整个页面。这个做法浪费了许多带宽，由于每次应用的交互都需要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。
XMLHttpRequest 对象
XMLHttpRequest对象是ajax的基础,XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。目前所有浏览器都支持XMLHttpRequest
五步使用法:
1.创建XMLHTTPRequest对象
2.使用open方法设置和服务器的交互信息
3.设置发送的数据，开始和服务器端交互
4.注册事件
5.更新界面
下面给大家列出get请求和post请求的例子
get请求：
// 步骤一：创建异步对象
var ajax = new XMLHTTPRequest()
// 步骤二：设置请求的url参数，参数一是请求的类型，参数二是请求的url，可以带参数，动态的传递参数starName到服务端
ajax.open('get','getStar.php?starName='+name)
// 步骤三：发送请求
ajax.send()
// 步骤四：注册事件 onreadystatechange 状态改变就会调用
ajax.onreadystaterchange = function(){
if(ajax.readyState==4 && ajax.status==200){
// 步骤五：如果能够进到这个判断 说明 数据完美的回来了，并且请求的页面是存在的
console.log(ajax.responseText) // 输入相应的内容
}
}
post请求：
// 步骤一：创建异步对象
var xhr = new XMLHTTPRequest()
// 步骤二：设置请求的类型及url
// post请求一定要添加请求头才行，不然会报错
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded")
xhr.open('post','02.post.php')
// 步骤三：发送请求
xhr.send('name=fox&age=18')
// 步骤四：注册事件 onreadystatechange 状态改变就会调用
xhr.onreadyStatechange = function(){
// 步骤五：如果能够进到这个判断 说明 数据完美的回来了，并且请求的页面是存在的
if(xhr.readyState==4&&xhr.status==200){
console.log(xhr.responseText)
}
}