• AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML);
  • AJAX 不是新的编程语言,而是一种使用现有标准的新方法;
  • 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新;

    操作

    ```javascript // 1.创建请求实例化对象 var xhr = new XMLHttpRequest() // readyState==0 // 2.添加参数 // 第一个参数为请求方式,第二个为请求地址和传参,第三个为是否异步加载 xhr.open(“get”,”getData.php?user=mike&pw=123”,true) // readyState==1 // 3.发起请求
    // 以POST方式请求时可以传输数据 xhr.send(“user=”+username+”&pw=”+pw); //get方式发送请求时: xhr.send(null);

xhr.send() // readyState == 2

  1. // 交互中 readyState == 3

// 收到返回值 xhr.responseText; // readyState == 4

xhr.onreadystatechange // 当readyState发生变化时,及请求状态发生变化时。

xhr.status // 是否请求到地址

xhr.abort() // 停止当前请求

// 完整过程 var xhr = new XMLHttpRequest()

xhr.open(“get”,”getData.php?user=mike&pw=123”,true)

xhr.send()

xhr.onreadystatechange=function(){

if (xhr.readyState==4 && xhr.status==200)

  1. {
  2. //接收服务器端响应数据,并用js进行处理,显示在客户端页面
  3. 例:document.getElementById("myDiv").innerHTML=xhr.responseText;
  4. }

}

```

基本流程

  • 对象初始化
  • 实例化对象
  • 发送请求
  • 服务器接收
  • 服务器返回
  • 客户端接收
  • 修改客户端页面的内容