jQuery Ajax-Analyse-Enzyklopädie

Dieses Mal bringe ich Ihnen eine umfassende Analyse von jQuery Ajax. Was sind die Vorsichtsmaßnahmen bei der Verwendung von jQuery Ajax? Hier sind praktische Fälle.

Was ist Ajax? Asynchrones JavaScript

und XML): Ins Chinesische übersetzt ist asynchrones JavaScript und XML.

Funktionell handelt es sich um eine Technologie, die einen Teil einer Webseite aktualisieren kann, ohne die gesamte Webseite neu laden zu müssen.

Traditionelle Webseite

Um Inhalte zu aktualisieren oder ein Formular einzureichen, müssen Sie die Seite neu laden oder aktualisieren.

Webseiten mit Ajax-Technologie

Mit einem geringen Datenaustausch über den Hintergrundserver kann die Webseite eine asynchrone Teilaktualisierung erreichen.

Vor dem Aufkommen von Ajax

Vor dem Aufkommen der Ajax-Technologie war es eine Welt der synchronen Interaktion.

Synchronisierung: Der Client sendet eine Anfrage, der Server verarbeitet sie und antwortet dann. Während dieser Zeit befindet sich der Client in einem Wartezustand. Wenn der Server die Verarbeitung der Antwort abgeschlossen hat, lädt der Client die Seite neu Wenn die Informationen falsch sind, wird der Client erneut eine Anfrage stellen und hier warten.

Nach dem Aufkommen von Ajax

Nach dem Aufkommen von Ajax veränderte sich die Welt und wurde zu einer asynchronen Welt.

Warum haben wir dann nicht vorher ein Objekt verwendet, das XMLHttpRequest-Objekt? Nachdem dieses Objekt erschienen ist, haben wir festgestellt, dass asynchrone Operationen möglich sind Dieses Objekt wird für den Datenaustausch zwischen dem Hintergrund und dem Server verwendet. In diesem Fall können lokale Daten aktualisiert werden, ohne dass die Seite aktualisiert werden muss asynchrones Laden und teilweise Aktualisierung.

Implementierung der asynchronen Lade-Teilaktualisierungsfunktion

1. Die erste Frage ist, wie das XHR-Objekt verwendet wird

1) Instanziieren Sie zuerst ein XMLHttpRequest

Hinweis: Die meisten Browser unterstützen jetzt beide das XMLHttpRequest-Objekt und die neue Methode, aber im Zeitalter von IE6 und darunter ist XHR immer noch nur ActiveXObject

Lösung:

Var request; 
If(window.XMLHttpRequest){ 
Reuest = new XMLHttpRequest(); 
}else{ 
Request = new ActiveXObject(“Microsoft.XMLHTTP”); 
}

2) Anfrage:

var request = new XMLHttpRquest();

Zuvor schauen wir uns an, was eine HTTP-Anfrage ist

Es ist eine Regel für Computer, über das Netzwerk zu kommunizieren.

ist ein zustandsloses Protokoll, das keine verbindungsbezogenen Informationen speichert

Der Client sendet eine Anfrage an den Server, der Server antwortet und dann wird die Verbindung geschlossen

Eine vollständige HTTP-Anfrage besteht aus sieben Schritten

A. Eine TCP-Verbindung herstellen

B. Der Client sendet den angeforderten Befehl an den Server

C. Der Browser sendet Anforderungsheader-Informationen

D. Der Server sendet eine Antwort E. Der Server sendet Antwortheader-Informationen

F. Der Server sendet Daten an den Browser

G. Der Server schließt die TCP-Verbindung

Getrennt betrachtet: Die HTTP-Anfrage ist in vier Teile unterteilt

HTTP-Anforderungsmethode und -Aktion (get, pos)

Angeforderte URL (Anforderungsadresse)

Anforderungsheader (enthält Client-Umgebungsinformationen, Authentifizierungsinformationen usw.)

Anfragetext, Anfragetext. Anfrage abrufen

: Wird im Allgemeinen zur Informationsbeschaffung verwendet (http-Standardanforderungsmethode)

Url传参属性和值都是可见的，对所发内容大小有限制 一般在2000个字符

get请求安全的说法是因为你请求一次和请求一万次效果是一样的不会对数据造成影响。

Post请求：一般用于服务器数据修改

对所发信息没有大小限制

HTTP响应有三部分

1)一个数字和文字组成的状态吗，用来显示请求是成功还是失败

2)响应头，和请求头信息一样包含很多信息，例如服务器类型，日期时间，内容类型和长度等

3)响应体，响应正文

HTTP响应状态吗由三位数字组成，首位数字定义了状态码的类型：

1xx：信息类，表示接收到浏览器请求，正在进一步处理

2xx:成功表示用户请求被正确接受

3xx:重定向，表示没有请求成功，客户必须采取进一步的动作

4xx:客户端错误，表示客户端请求有错误404NOTFound意味着请求中所引用的文档不存在

5xx：服务器错误，表示服务器不能完成对请求的处理

通过XMLHttpRequest发送请求

1.创建

var request = new XMLHttpRquest();

2.发送请求

两个方法：

open(method,url,async),Send(string)这两种方法可以将请求发送到服务器

Request.open(get,get.php,true)
Request.Send()
Request.open(post,post.PHP,true) 
Request.Send()
Request.open(post,post.php,true) 
Request.setRequestHeader(‘Content-Type','application/x-www-form-urlencoded') 
Request.send(“name=王二狗&sex=男”);

send()中的内容是要向后台传递的参数，在get请求是通过url传递参数，所以get中send()里面的内容可以省略，post方式中不能省略，省略了之后就是无意义的请求了

setRequestHeader是用来设置请求参数的类型，form

3.获取响应

responseText:获取字符串形式的响应式数据

responseXML:

Status和statusText：以数字和文本形式返回HTTP状态吗

getAllResponseHeader():获取所有的响应报头

getResponseHeader():查询相应中的某个字段的值

在响应返回成功时得到的通知，在实际操作中要监听

readyState属性的变化，他的变化代表着服务器相应的变化

0：表示服务器请求未初始化，open还没有被调用

1：服务器连接已经建立，open已经被调用

2：请求已经被接受，接收到头部信息

3：处理中，接收到相应主体

4：请求完成，并且响应完成

Var request=new XMLHttpRequest();
Request.open(get,url,true)
Request.send();
request.onreadyState=function(){
 If(request.readeyState===4&&request.Status===200){
 做一些事情 request.responseText
 }
}

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

推荐阅读：

使用Jquery获取iframe页面中Dom元素

$.ajax()使用详解

Das obige ist der detaillierte Inhalt vonjQuery Ajax-Analyse-Enzyklopädie. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!