ajax基础信息前面都已经介绍过了。这个就略过。

使用原生js操作ajax的话还是比较容易的,跟前面的一篇内容基本差不多。

使用步骤:

一、创建对象 XMLHTTPRequest/ActiveOBject

二、发送请求 open()、send()

三、服务器响应 responseText(onreadystatechange、readyState、status)

步骤大体就分为这三个。

创建对象

 var xmlHttp;    if(window.XMLHttpRequest){        xmlHttp = new XMLHttpRequest();    }else{        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");    }

如果是ie5、ie6的浏览器是不支持 XMLHttpRequest()这个对象的,需要用ActiveXObject()这个对象来实现。

上面的window.XMLHTTPRequest判断浏览器是否支持XMLHttpRequest()这个功能,如果支持就创建对象不支持则创建ActiveXObject对象。

发送请求

使用open()方法来创建请求,里面有两个参数,第一个参数是用什么方式来请求,一般常用的get post两种,第二个参数就是要请求的url地址。

用send()方法来发送参数,如果请求的地址不带参数则填null。

xmlHttp.open("GET","ceshi.php");xmlHttp.send(null);

这儿访问的是本地的ceshi.php,这个不管哪种编程语言,只要是能开发web的编程语言都可以实现。

服务器响

使用responseText来接收服务器响应

xmlHttp.onreadystatechange = function(){    if(xmlHttp.readyState == 4){        if(xmlHttp.status == 200 || xmlHttp.status==304){            alert(xmlHttp.responseText);                           }    }}

第一个判断 onreadystatechange 当请求被发送到服务器时,需要执行一些基于响应的任务。每当 readyState 改变时,就会触发 onreadystatechange 事件。

readyState是指存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

以下就是readyState存储的值。

0: 请求未初始化

1: 服务器连接已建立

2: 请求已接收

3: 请求处理中

4: 请求已完成,且响应已就绪

所以在上面判断readyState是否等于4 如果等于4的话就代表响应已经完成。

status这个是一个状态值判断200或者304是请求处于正常状态。

常用status状态值有 200(正常) 403(找不到页面) 500(服务器异常)。

至此前台的程序已经完毕。

接下来需要在程序文件 ceshi.php文件里面创建内容,这儿只做个简单的演示内容

ceshi.php

ceshi

"?>

上面只是用aler打印出来。如果要放到网页页面上,就需要大家学习DOM的内容了。