ajax在JavaScript的使用：异步传输，局部刷新

如果大家学过Servlet的话那么你对Servlet访问服务器应该很了解了，就是浏览器发送请求给服务端的，服务端做出响应的是一个页面，例如 我们判断用户名是否存在的话

仅仅只需要传输用户名就可以了，但是我们会将页面所有参数都传到后台进行判断，这是所谓的同步传输，这样会浪费很多网络资源，并且当你等待后台响应的时候页面会显示的是空白页面。所以ajax解决的问题：当html页面仅仅需要判断一条数据的时候，我们还用之前的表单提交或者页面跳转的话，是将整个页面作为单位进行传输，这样会耗费大量的网路资源。所以就用ajax这门技术来帮我们解决这个问题。总的来书就是 异步传输，局部刷新

下面来具体说一下ajax（异步javaScript xml）的具体使用

<script type="text/javascript">

//首先的获取XMLHttpRequest对象 该对象是ajax的核心，它的作用是

1：发送异步请求

2：接受响应回来的数据

var xmlHttp;
function createXMLHttpRequest() {
//本地浏览器是否支持ActiveX对象，返回对象为true，返回null为false
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
//本地浏览器是否支持XMLHttpRequest对象
} else if (window.XMLHttpRequest) {
//作为一个JavaScript对象来创建
xmlHttp = new XMLHttpRequest();
}

}

//当页面加载完毕后执行下面方法体的代码

window.onload = function() {

var btn = document.getElementById('btn');

//当btn按钮点击的时候触发

btn.onclick = function() {

//调用创建XMLHttpRequest对象的方法

createXMLHttpRequest();

        //指定你要访问后台的链接 第一个参数 是请求方式 get post put  第二个是访问的url地址，第三个是true是异步传输，false是同步传输

xmlHttp.open("get", "firstServlet?text="+text.value, true);

//当使用post请求提交的时候需要添加下面一行代码并且参数可以在url后添加也可以在send方法中
 //  xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");

//下面的一行代码是readyState（

 readyState记录XMLHttpRequest对象的状态变化。
0 (未初始化) 新的XMLHttpRequest对象实例已建立，但是尚未初始化（尚未调用open方法） 
1 (正在加载) 新的XMLHttpRequest对象实例已建立，尚未调用send方法 。
2 (已经加载) send方法已调用，但是当前的response状态未知 
3 (交互中) 客户端已接收部分response中的信息，但是没有全部接受，这时通过responseXML或者responseText获取部分数据会出现错误， 
4 (完成) 数据接收完毕,此时可以通过responseXML或者responseText获取完整的应答信息。

）

//onreadystatechange就是记录readyState的变化当该对象的值变化时调用rowback（回调函数）

xmlHttp.onreadystatechange = rowback

//正式发送请求;

xmlHttp.send(null);
}

}

//上面所提到的回调函数的实现
function rowback() {
//当后台传输数据完毕的时候
if (xmlHttp.readyState==4) {

//status   服务器的HTTP状态码(200=OK 404=Not Found IE(1223)   FireFox(204)=服务器没有信息返回
if(xmlHttp.status==200){

         //用变量去接受响应回来的xml或者让text  xml可以直接当做元素处理
var xml=xmlHttp.responseXML;
       // var text=xmlHttp.responseText;

}

</script>

function rowback() {
console.log(xmlHttp.readyState);


if (xmlHttp.readyState==4) {
if(xmlHttp.status==200){
var xml=xmlHttp.responseXML;
       // var text=xmlHttp.responseText;

}