初始Ajax

Ajax是什么

• Ajax就是让浏览器跟服务器交互的一套API。 它的作用就是可以让浏览器和服务器进行交互。
  • 说人话： ajax 是一种 用于向服务器请求数据的 技术
• MDN官网传送门:https://developer.mozilla.org/zh-CN/docs/Web/Guide/AJAX

服务器

服务器指一个管理资源并为用户提供服务的计算机，通常分为文件服务器、数据库服务器和应用程序服务器。运行以上软件的计算机或计算机系统也被称为服务器。相对于普通PC来说，服务器在稳定性、安全性、性能等方面都要求更高，因此cpu、芯片组、内存、磁盘系统、网络等硬件和普通PC有所不同。

访问服务器的方式

• （1）地址栏输入网址url
• （2）html的a标签href属性
• （3）js的location.href = url
• （4）ajax技术

服务器交互流程

• 请求(浏览器发送请求,服务器接收)
• 处理(服务器处理这个需求)
• 响应(服务器响应数据给浏览器)

为什么需要ajax

• ajax可以在网页不刷新的情况下给后台发送请求,让网站数据内容动态变化
• ajax是局部刷新

ajax工作流程

• get请求

	//(1).实例化ajax对象
    let xhr = new XMLHttpRequest()
    //(2).设置请求方法和地址
    //get请求的数据直接添加在url的后面 格式是 url?key=value
    xhr.open('get', '接口url')
    //(3).发送请求
    xhr.send()
    //(4).注册回调函数
    xhr.onload = function() {
      console.log(xhr.responseText)
    }

• post请求

//(1).实例化ajax对象
    let xhr = new XMLHttpRequest()
    //(2).设置请求方法和地址
    xhr.open('post', '')
    //(3).设置请求头（post请求才需要设置）
    xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded')
    //(4).发送请求 ： 参数格式  'key=value' 
    xhr.send('key=value')
    //(5).注册回调函数
    xhr.onload = function () {
      console.log(xhr.responseText)
    }

原文地址：https://www.jb51.cc/wenti/3280796.html