初学NodeJS一

Ajax 介绍

在 node.js 中前后台交互数据经常会用到这个东西，Ajax 不是新的编程语言，而是一种使用现有标准的新方法，他可以实现不刷新网页部分更新数据。

Ajax 数据格式

ajax 封装

使用封装 Ajax 需要了解什么是XMLHttpRequest；

什么是 XMLHttpRequest

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新

创建 XMLHttpRequest 对象实例：
var XMLHttpRequest=new XMLHttpRequest();

Ajax 的传输方式

传输数据方式有两种，一种get，一种post。

get: 地址栏 - 数据都可视，不安全，方便 可传输数据大小 32kb
post: 加密 - 数据不可视，安全，不方便 可传输数据大小 2gb

向后端发送数据

利用 XMLHttpRequest 对象的 open 方法

open 方法用于解析数据传输方式，数据内容，是否异步调用

get 方法

var XMLHttpRequest = new XMLHttpRequest();
XMLHttpRequest.open('GET','数据',true);
XMLHttpRequest.send();

var XMLHttpRequest = new XMLHttpRequest();
XMLHttpRequest.open('POST','数据',true);
XMLHttpReuqest.send();

异步 – True 或 False
同步：后台进程一步一步完成
异步：后台进程同时调用运行

XMLHttpRequest 的 open 方法第三个参数‘true’or‘false’就是选择是否异步，当然选择 true 啦，高效。

XMLHttpRequest.onreadystatechange=function() {if(XMLHttpRequest.readyState == 4) {if(XMLHttpRequest.status >= 200 && XMLHttpRequest.status < 300 || XMLHttpReuqest.status == 304) {//console.log(XMLHttpRequest.responseText);
                    json.success(XMLHttpReuqest.responseText);
                }else{//console.log('服务器错误');
                }
            }
        }

onreadystatechange 方法：当状态码改变时触发，
readyState 当前状态码

什么是状态码

   ajax 状态码 - ajax readyState：0 -（未初始化）还没有调用 send()方法
    1 -（载入）已调用 send()方法，正在发送请求
    2 -（载入完成）send()方法执行完成，已经接收到全部响应内容
    3 -（交互）正在解析响应内容
    4 -（完成）响应内容解析完成，可以在客户端调用了

• XMLHttpRequest.state

当前进程加载状态，例如 404 是无回应的，200 是加载成功等

服务器响应

如果服务器有内容响应也就是后端有数据返回前端则有两个 XMLHttpRequest 对象获取responseText，responseXML。
responseText 返回字符串形式的数据
responseXML 返回 XML 形式的数据

responseText 例子

html:
    <div id="div1"></div>
js:
    var XMLHttpRequest = new XMLHttpRequest();
    document.getElementById("div1").innerHTML=XMLHttpRequest.responseText;