Heim >Web-Frontend >js-Tutorial >Wie verwende ich Ajax konkret? Vierstufige Analyse mit Ajax (mit Beispielen)

Wie verwende ich Ajax konkret? Vierstufige Analyse mit Ajax (mit Beispielen)

寻∝梦
寻∝梦Original
2018-09-10 13:57:562214Durchsuche

本篇文章主要的介绍了关于ajax使用的四个步骤,想看的同学赶紧看过来,现在我们就开始阅读本篇文章吧

1.第一步(得到XMLHttpRequest)

*ajax其实只需要学习一个对象:XMLHttpRequest,如果掌握了它就掌握了AJAX

*得到XMLHttpRequest

    >大多数浏览器都支持:var  xmlHttp=new  XMLHttpRequest();

    >IE6.0支持:var  xmlHttp=new  ActiveXObject("Msxml2.XMLHTTP");

    >IE5.5及更早版本的IE支持:var  xmlHttp=new  ActiveXObject("Microsoft.XMLHTTP");

*编写创建 XMLHttpRequest 的函数

 function createXMLHttpRequest() {
           try{
                    return  new  XMLHttpRequest();
           }catch{
                    try{
                            return
  new  ActiveXObject("Msxml2.XMLHTTP");
                    }catch{ 
                               try{
                                        return  newActiveXObject("Microsoft.XMLHTTP");
                             }catch{
                                  alert("怎么可能,你用的啥浏览器。。。")
                                   throw   e;
                             }
                    }
           }
}

2.第二步 (打开与服务器的连接)

*xmlHttp.open();用来打开与服务器的连接,需要三个参数;

      >请求方式:GET或者POST

      >请求的URL:指定服务器端资源,例如:/项目/action

      >请求是否为异步:如果为True表示发送异步请求,否则为同步请求;

*xmlHttp.open("GET","/项目/action",true);(想看更多就到PHP中文网AJAX开发手册栏目中学习)

3.第三步  (发送请求)

*xmlHttp.send(null); 如果括号里不给null可能会造成部分浏览器无法发送;

     >参数:就是请求体的内容,如果是GET请求,必须给null

4.第四步   

*在xmlHttp对象的一个事件上注册监听器:onredaystatechange

*xmlHttp对象一共有5个状态:

     >0状态:刚创建,还没有调用open()方法;

     >1状态:请求开始,调用了open()方法,但还没有调用send()方法;

     >2状态:调用完了send()方法;

     >3状态:服务器已经开始响应,但不表示响应结束;

     >4状态:服务器响应结束!(我们通常只关注这个状态!!!)

*得到xmlHttp对象的状态;

      >var  state  =xmlHttp.redayState;  //可能是0、1、2、3、4

*得到服务器的响应状态码

      >var  state  =xmlHttp.status; //例如为200、404、500

*得到服务器的响应内容

>var  content = xmlHttp.responseText; //得到服务器响应的文本格式内容;
 
     >var  content = xmlHttp.responseXML; //得到服务器响应的xml内容,它是Document对象;
 
 xmlHttp.onredaystatechange=function() { //5种状态都会调用本方法;
 
          if(xmlHttp.redayState==4 && xmlHttp.status==200){  //双重判断,缺一不可
               
 //获取服务器的响应内容
 
                 var  text = xmlHttp.responseText;
 
          }
 };

本篇文章到这就结束了(想看更多就到PHP中文网AJAX使用手册栏目中学习),有问题的可以在下方留言提问。

Das obige ist der detaillierte Inhalt vonWie verwende ich Ajax konkret? Vierstufige Analyse mit Ajax (mit Beispielen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn