[TOC] ## Ajax ajax 全名 async javascript and XML(异步JavaScript和XML) 是前后台交互的能⼒ 也就是我们客户端给服务端发送消息的⼯具，以及接受响应的⼯具 AJAX 不是新的编程语言，而是一种使用现有标准的新方法。 AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。 是⼀个 默认异步执⾏机制的功能,AJAX分为同步（async = false）和异步（async = true） ## 创建Ajax语句 ~~~ 变量名称 = new XMLHttpRequest(); ~~~ ## 向服务发送请求 ~~~ 变量名.open(*method*,*url*,*async*) *method*：请求的类型；GET 或 POST *url*：文件在服务器上的位置 *async*：true（异步）或 false（同步） 变量名.send() //向服务器发送请求 ~~~ ## 事件onreadystatechange ~~~ 当我们的请求发送到服务器后，执行一些基于响应的反应 onreadystatechange 每当 readyState 属性改变时，就会调用该函数。 readyState 存有 XMLHttpRequest 的状态信息 * 0: 请求未初始化 * 1: 服务器连接已建立 * 2: 请求已接收 * 3: 请求处理中 * 4: 请求已完成，且响应已就绪 status 网页状态码 ~~~ ## 获取响应 ~~~ responseText //获得字符串形式的响应数据。 responseXML //获得 XML 形式的响应数据。 ~~~ ## 其他语句 ~~~ innerHTML 设置或返回表格行的开始和结束标签之间的 HTML。 ~~~ ## 例子 ~~~ //创建ajak对象 ajak = new XMLHttpRequest(); //通过GET方式打开url ajak.open("GET","/checkUser.php?name="+username) //发送请求 ajak.send(); //当状态发生改变时，做什么 ajak.onreadystatechange = function() { //状态为4和响应码为200 if (ajak.readyState == 4 && ajak.status == 200){ //获取相应的内容 // alert(ajak.responseText) if (ajak.responseText == 1){ // alert("用户名已存在") user_msg.innerHTML = "<font color='#ff69b4'>名字不可用</font>"; }else{ // alert("用户名可以用") user_msg.innerHTML = "<font color='#7fff00'>名字可用</font>"; } } } ~~~