Implementieren Sie die Ajax-Methode, um asynchrone Anfragen zu senden

Dieses Mal werde ich Ihnen vorstellen, wie Sie Ajax zum Senden asynchroner Anforderungsmethoden implementieren und welche Vorsichtsmaßnahmen für die Implementierung von Ajax zum Senden asynchroner Anforderungen gelten. Das Folgende ist eine praktische Anleitung Fall, werfen wir einen Blick darauf.

ajax sendet eine asynchrone Anfrage für Ihre Referenz. Der spezifische Inhalt ist wie folgt

Erster Schritt(XMLHttpRequest abrufen)

Ajax muss eigentlich nur ein Objekt lernen: XMLHttpRequest. Wenn Sie es beherrschen, werden Sie Ajax beherrschen!!!

1. Holen Sie sich XMLHttpRequest

Die meisten Browser unterstützen:var xmlHttp=new XMLHttpRequest();
IE6.0:var xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
IE5.0 und frühere Versionen von IE:var xmlHttp =new ActiveXObject( "Microsoft.XMLHTTP");

2. Schreiben Sie eine Funktion, die ein XMLHttpRequest-Objekt

function createXMLHttpRequest(){
     try{
     return new XMLHttpRequest();
     } catch(e){
     try{
     return new ActiveXObject(“Msxml2.XMLHTTP”);
    }catch(e){
     try{
      return new ActiveXObject(“Microsoft.XMLHTTP”);
     }catch(e){
       alert(“哥们儿,你用的是什么浏览器啊?”);
       throw e;
    }
    }
     } 
}

erstellt Schritt 2(Öffnen Sie die Verbindung zum Server)

xmlHttp.open(): wird zum Öffnen einer Verbindung mit dem Server verwendet und erfordert drei Parameter:

Anforderungsmethode: Kann GET oder POST sein
Angeforderte URL: Geben Sie die serverseitige Ressource an, zum Beispiel: /day23_1/AServlet
Ob die Anforderung asynchron ist: Wenn wahr, bedeutet dies Senden eine asynchrone Anfrage, andernfalls eine synchrone Anfrage

xmlHttp.open("GET","/day23_1/AServlet",true);//Zum Beispiel

Schritt 3(Anfrage senden)

xmlHttp.send(null): Wenn nicht angegeben, können einige Browser möglicherweise nicht senden! Parameter: Es handelt sich um den Inhalt des Anfragetextes! Wenn es sich um eine GET-Anfrage handelt, muss null angegeben werden.

Wenn es sich um eine

POST-Anfrage
handelt, lautet das Folgende:

xmlHttp.send(“username=zhangSan&password=123”);

Schritt 4:

Registrieren Sie einen Listener für ein Ereignis des xmlHttp-Objekts: onreadystatechange

Das xmlHttp-Objekt hat insgesamt 5 Zustände

0: Die Initialisierung ist nicht abgeschlossen, das XMLHttpRequest-Objekt wurde nur erstellt und die Methode open() wurde noch nicht aufgerufen

1: Die Anfrage wurde gestartet, die Methode open() wurde aufgerufen, aber die Methode send() Methode wurde noch nicht aufgerufen

2: Sendeabschlussstatus anfordern, send()-Methode wurde aufgerufen
3: Lesen der Serverantwort beginnen
4: Lesen der Serverantwort beenden (normalerweise kümmern wir uns nur um den letzten Status !!!)

Rufen Sie den Status des xmlHttp-Objekts ab

Rufen Sie den

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

Statuscode

der Serverantwort ab (200: Erfolg, 304: Status hat sich nicht geändert, 404 500: Serverfehler)

Holen Sie sich den Inhalt der Serverantwort

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

Der Zuhörer sollte also so geschrieben sein

var content=xmlHttp.responseText;//得到服务器的响应的文本格式的内容(这更通用)
var content=xmlHttp.responseXML;//得到服务器的响应的xml响应的内容,它是document对象了!

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

xmlHttp.onreadystatechange = function(){
  //xmlHttp的5种状态都会调用本方法
    if(xmlHttp.readyState ==4 && xmlHttp.status == 200){
  //双重判断:判断是否为4状态,而且还要判断是否为200
      var text=xmlHttp.responseText;
     } 
};

Empfohlene Lektüre:

Detaillierte Erklärung der Verwendung von vue-cli+sass

So erstellen Sie eine Countdown-Funktion mit Datum Objekt

Das obige ist der detaillierte Inhalt vonImplementieren Sie die Ajax-Methode, um asynchrone Anfragen zu senden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!