Kennen Sie die grundlegende Entwicklung von Ajax? Detaillierte Erläuterung der grundlegenden Entwicklungsschritte von Ajax (mit Beispielen)-js-Tutorial-php.cn

In diesem Artikel geht es hauptsächlich um die grundlegenden Entwicklungsschritte von Ajax. Wenn Sie ein tieferes Verständnis der Ajax-Entwicklung haben möchten, müssen Sie die Entwicklungsschritte kennen wie man es benutzt. Beginnen Sie jetzt mit dem Lesen dieses Artikels

Was ist Ajax? Was ist der Nutzen?
Der vollständige Name von Ajax lautet „Asynchrous Javascript And XML“ und bezieht sich auf eine Webentwicklungstechnologie zum Erstellen interaktiver Webanwendungen. Dabei handelt es sich um eine Technologie zur schnellen Erstellung dynamischer Webseiten, um die Effizienz der Interaktion zwischen Browsern und Servern zu verbessern. Es kann den herkömmlichen Web-Interaktionsmodus ersetzen.
Wie ist diese Synchronisation und Asynchronität zu verstehen?

Was ist das traditionelle synchrone Interaktionsmodell?
Im herkömmlichen Modell wird der synchrone Interaktionsmodus verwendet. Der Client-Browser stellt eine Anfrage an den Server und wartet dann, bis der Server auf die Anfrage antwortet, und kann keine anderen Vorgänge ausführen.
Was ist das asynchrone Interaktionsmodell der Mainstream-Technologie?
Im asynchronen Ajax-Interaktionsmodus gibt es eine zusätzliche Übertragungsobjekt-Ajax-Engine zwischen dem Client-Browser und dem Server. Wenn der Client-Browser eine Anfrage an die Ajax-Engine sendet, ist die Ajax-Engine dann für die Übertragung der Anfrageinformationen verantwortlich der Server, sodass der Client-Browser nach dem Senden der Anfrage den Vorgang fortsetzen kann, anstatt sich in einem Wartezustand zu befinden. Nachdem der Server die Ajax-Engine-Anfrage verarbeitet hat, leitet er die Antwort an die Ajax-Engine weiter und die Ajax-Engine aktualisiert die Client-Browserseite.
Ajax-Entwicklungsschritte
Schritt eins: Holen Sie sich das XMLHttpRequest-Objekt.
Beispielcode finden Sie im XML-Dokument von w3school.

var xmlhttp = null;if(window.XMLHttpRequest){    //这个是针对浏览器IE7及其7以上的版。
    xmlhttp = new XMLHttpRequest();
}else if(window.ActiveXObject){    //这个是针对浏览器5到7的版本。
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

Nach dem Login kopieren

Schritt 2: Registrieren Sie die Rückruffunktion.

 xmlhttp.onreadystatechange = function(){ 
};

Nach dem Login kopieren

onreadystatechange ist ein Event-Handler für Ereignisse, die durch jede Statusänderung ausgelöst werden.

Schritt 3: open("method","URL",async,"uname","pswd")
Wird nur zum Festlegen der Anforderungsmethode, des URL-Pfads und der Synchronisierung verwendet . Es wird keine Anfrage gesendet.

参数	作用
method	发送请求的方式，可选的参数有：GET、POST和PUT。
URL	要发送的URL路径，可以使用绝对路径和相对路径。
async	请求是否要被异步处理。也可以不写，默认为true。
	true，脚本处理会在send()发送之后继续处理，即异步处理。
	false，在继续脚本处理之前，脚本会等待某个响应，即同步处理。
uname	目前还没用过，文档也没有说明。直接不写就行。
pswd	目前还没用过，文档也没有说明。直接不写就行。

Was passiert, wenn die URL Parameter erfordert?
Wenn es sich um eine Get-Anfrage handelt, verketten Sie die Parameter direkt nach der URL.
Zum Beispiel: xmlhttp.open("get","http://www.baidu.com?name=xiaosan");

Wenn es sich um eine Post-Anfrage handelt, sind mehrere Einstellungsvorgänge erforderlich:
Zum Beispiel: xmlhttp.open("post","http://www.baidu.com");
xmlhttp.setRequestHeader("content-type","application/x-www-form-urlencoded ";

Schritt 4: (Inhalt) senden

Anfrage senden. Wenn keine Parameter vorhanden sind, wird es als send(null) geschrieben.

Schritt 5: Führen Sie bestimmte Datenoperationen in der Rückruffunktion aus.

Zuvor müssen Sie einige Eigenschaften von XMLHttpRequest verstehen.

属性	描述
onreadystatechange	状态发生改变的时候，能触发一些事情。
readyState	详情见下表
status	数字返回状态，比如”OK”为200，”Not Found”为404等
statusText	字符串返回状态，比如”OK”,”Not Found”等
responseText	以字符串返回响应。
responseXML	以XML返回响应。返回的是一个XML对象，可以用DOM进行解析

Die folgende Tabelle zeigt den Statuswert eines readyState und die Bedeutung des Statuswerts:

Was ist Ajax? Was ist der Nutzen?
Der vollständige Name von Ajax lautet „Asynchrous Javascript And XML“ und bezieht sich auf eine Webentwicklungstechnologie zum Erstellen interaktiver Webanwendungen. Dabei handelt es sich um eine Technologie zur schnellen Erstellung dynamischer Webseiten, um die Effizienz der Interaktion zwischen Browsern und Servern zu verbessern. Es kann den herkömmlichen Web-Interaktionsmodus ersetzen.
Wie ist diese Synchronisation und Asynchronität zu verstehen?
Was ist das traditionelle synchrone Interaktionsmodell?
Im herkömmlichen Modell wird der synchrone Interaktionsmodus verwendet. Der Client-Browser stellt eine Anfrage an den Server und wartet dann, bis der Server auf die Anfrage antwortet, und kann keine anderen Vorgänge ausführen. (Wenn Sie mehr erfahren möchten, besuchen Sie die Spalte „PHP Chinese Website“ AJAX Development Manual , um mehr zu erfahren)
Was ist das asynchrone Interaktionsmodell der Mainstream-Technologie?
Im asynchronen Ajax-Interaktionsmodus gibt es eine zusätzliche Übertragungsobjekt-Ajax-Engine zwischen dem Client-Browser und dem Server. Wenn der Client-Browser eine Anfrage an die Ajax-Engine sendet, ist die Ajax-Engine für die Übertragung der Anfrageinformationen an den Server verantwortlich Server, sodass der Client-Browser nach dem Senden der Anfrage den Vorgang fortsetzen kann, anstatt sich in einem Wartezustand zu befinden. Nachdem der Server die Ajax-Engine-Anfrage verarbeitet hat, leitet er die Antwort an die Ajax-Engine weiter und die Ajax-Engine aktualisiert die Client-Browserseite.
Ajax-Entwicklungsschritte
Schritt eins: Holen Sie sich das XMLHttpRequest-Objekt.
Beispielcode finden Sie im XML-Dokument von w3school.

var xmlhttp = null;if(window.XMLHttpRequest){    //这个是针对浏览器IE7及其7以上的版。
    xmlhttp = new XMLHttpRequest();
}else if(window.ActiveXObject){    //这个是针对浏览器5到7的版本。
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

Nach dem Login kopieren

Schritt 2: Registrieren Sie die Rückruffunktion.
xmlhttp.onreadystatechange = function(){
}; onreadystatechange ist ein Ereignishandler für Ereignisse, die durch jede Zustandsänderung ausgelöst werden.

Schritt 3: open("method","URL",async,"uname","pswd")

Wird nur zum Festlegen der Anforderungsmethode, des URL-Pfads und der Synchronisierung verwendet. Dies ist der Fall nicht senden, fragen.

参数	作用
method	发送请求的方式，可选的参数有：GET、POST和PUT。
URL	要发送的URL路径，可以使用绝对路径和相对路径。
async	请求是否要被异步处理。也可以不写，默认为true。
	true，脚本处理会在send()发送之后继续处理，即异步处理。
	false，在继续脚本处理之前，脚本会等待某个响应，即同步处理。
uname	目前还没用过，文档也没有说明。直接不写就行。
pswd	目前还没用过，文档也没有说明。直接不写就行。

Was passiert, wenn die URL Parameter erfordert?

Wenn es sich um eine Get-Anfrage handelt, verketten Sie die Parameter direkt nach der URL.
Zum Beispiel: xmlhttp.open("get","http://www.baidu.com?name=xiaosan");

Wenn es sich um eine Post-Anfrage handelt, sind mehrere Einstellungsvorgänge erforderlich:

Zum Beispiel: xmlhttp.open("post","http://www.baidu.com");
xmlhttp.setRequestHeader("content-type","application/x-www-form-urlencoded ";

Schritt 4: (Inhalt) senden
Anfrage senden. Wenn keine Parameter vorhanden sind, wird es als send(null) geschrieben.

Schritt 5: Führen Sie bestimmte Datenoperationen in der Rückruffunktion aus.
Bevor Sie dies tun, müssen Sie einige Eigenschaften von XMLHttpRequest verstehen.

属性	描述
onreadystatechange	状态发生改变的时候，能触发一些事情。
readyState	详情见下表
status	数字返回状态，比如”OK”为200，”Not Found”为404等
statusText	字符串返回状态，比如”OK”,”Not Found”等
responseText	以字符串返回响应。
responseXML	以XML返回响应。返回的是一个XML对象，可以用DOM进行解析

Die folgende Tabelle zeigt den Statuswert eines readyState und die Bedeutung des Statuswerts:

Dieser Artikel endet hier (denken Sie an „Lernen“. Weitere Informationen finden Sie in der Spalte „PHP Chinesisch“ auf der Website

AJAX-Benutzerhandbuch

状态值	代表的状态释义
0	未初始化的状态，代表XMLHttpRequest对象被创建之前
1	加载中的状态，open操作。
2	已加载的状态，send操作。
3	交互的状态，接收到了响应数据，但只有响应头，正文还没别接收。
4	完成的状态，所有的http响应接收完成。

. Wenn Sie Fragen haben, können Sie unten eine Nachricht hinterlassen.

Das obige ist der detaillierte Inhalt vonKennen Sie die grundlegende Entwicklung von Ajax? Detaillierte Erläuterung der grundlegenden Entwicklungsschritte von Ajax (mit Beispielen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!