Explicación detallada de los fundamentos de Ajax

La función principal de Ajax es implementar el acceso asíncrono del lado del navegador al servidor: mediante el objeto XMLHttpRequest del navegador, se envían datos en pequeñas cantidades para interactuar con el servidor, el servidor devuelve datos en pequeñas cantidades, y luego se actualiza parte de la página del cliente.

1.primero instanciar el objeto XMLHttpRequest

var request;
if (window.XMLHttpRequest){
 request=new XMLHttpRequest();
}
else{
 request=new ActiveXObject("Microsoft.XMLHTTP");
 //compatibilidad con ie5 6
}

2.métodos de XMLHttpRequest envían la solicitud al servidor

request.open("POST",get.php,true);//solicitud
//establece la información de encabezado http, informa al servidor de que enviamos un formulario en pares clave-valor
request.setRequestHeader("Content-Type","application/x-www-form-urlencoded);
//POST debe establecer el Content-el valor de Type está entre open y send
request.send("name=王二狗&sex=男");//se envía al servidor utilizando el método send

3.métodos para obtener la respuesta

responseText obtiene los datos de respuesta en formato de cadena
responseXML obtiene los datos de respuesta en formato XML
status y statusText devuelven el código de estado HTTP en forma numérica y de texto
getAllResponseHeader() obtiene todos los encabezados de respuesta
getResponseHeader() consulta el valor de un campo específico en la respuesta

4Escuchar el cambio del atributo readyState es muy importante

　　　 Para 0 La solicitud no se ha inicializado, open no se ha llamado

　　　 Para1 Se ha establecido la conexión del servidor, se ha llamado a open

　　　 Para2 La solicitud se ha recibido, se ha recibido la información de encabezado

　　　 Para3 La solicitud se está procesando, se ha recibido el cuerpo de respuesta

　　　 Para4 La solicitud se ha completado y la respuesta está lista, la respuesta se ha completado

//El cambio de readyState desencadena
//Judgar el cambio del atributo readyState a través del evento onreadystatechange
request.onreadystatechange=function(){
 if(request.readyState===4&&request.status===200){
 //Hacer algunas cosas, por ejemplo, obtener los datos de respuesta request.responseText
 }
}

5XHR completo

var request=new XMLHttpRequest();//1Crear un objeto XHR
request.open("GET","get.php#63;number=" +Los datos que se deben enviar en el formulario, true);//2Llamar al método open
//Si es una solicitud POST, send es un objeto que contiene datos
request.send();//Enviar algunos datos
request.onreadystatechange=function(){ //3Escuchar y判断服务器是否正确响应
 if(request.readyState===4&&request.status===200){
 //4Hacer algunas cosas, por ejemplo, obtener el contenido de respuesta del servidor request.responseText
 }
}

Este es el contenido completo del artículo, esperamos que el contenido de este artículo le ayude en su aprendizaje o trabajo, y también esperamos que nos apoye mucho en el tutorial de grito!

Aviso: El contenido de este artículo se ha obtenido de la red, es propiedad del autor original, el contenido ha sido contribuido y subido por usuarios de Internet, este sitio no posee los derechos de propiedad, no ha sido editado por humanos y no asume responsabilidad alguna por las leyes de derechos de autor. Si encuentra contenido sospechoso de infracción de derechos de autor, le invitamos a enviar un correo electrónico a: notice#oldtoolbag.com (al enviar un correo electrónico, reemplace # con @) para denunciar y proporcionar evidencia relevante. Una vez verificada, este sitio eliminará inmediatamente el contenido sospechoso de infracción.