Maison >interface Web >js tutoriel >Quelle est la fonction d'ajax ? Explication détaillée de la fonction et de la méthode d'écriture d'ajax

Quelle est la fonction d'ajax ? Explication détaillée de la fonction et de la méthode d'écriture d'ajax

寻∝梦
寻∝梦original
2018-09-10 14:38:569695parcourir

Cet article parle principalement de la définition de ajax, ainsi que du rôle d'ajax, et enfin d'une explication détaillée de la façon d'écrire ajax. Lisons maintenant cet article ensemble

Qu'est-ce que AjAx ?

Javascript et XML asynchrones.

Quelle est la fonction ?

Échangez des données avec le serveur via AjAx, et AjAx peut utiliser des pages Web pour implémenter les mises à jour de mise en page.

Cela signifie que des parties de la page peuvent être mises à jour sans recharger la page entière.

Comment implémenter Ajax ?

Objet XmlHttpRequest. Utilisez cet objet pour envoyer des requêtes de manière asynchrone au serveur, obtenir des mises à jour de réponse et effectuer des mises à jour partielles. Ouvrir envoyer une réponse partielle ResponseText/ResponseXML. (Si vous voulez en savoir plus, rendez-vous sur le site Web PHP chinois Colonne Manuel de développement AJAX pour en savoir plus)

Scénarios d'utilisation

Connexion La page ne sautera pas en cas d'échec.

L'inscription vous demandera si le nom d'utilisateur existe en temps réel.

Lien entre les provinces et les municipalités.

Gérer le serveur d'images et effectuer un chargement différé.

NatifAjAxÉcriture :

var XHR=null; 
if (window.XMLHttpRequest) { 
    // 非IE内核 
    XHR = new XMLHttpRequest(); 
} else if (window.ActiveXObject) { 
    // IE内核,这里早期IE的版本写法不同,具体可以查询下 
    XHR = new ActiveXObject("Microsoft.XMLHTTP"); 
} else { 
    XHR = null; 
}  
if(XHR){ 
    XHR.open("GET", "ajaxServer.action");  
    XHR.onreadystatechange = function () { 
        // readyState值说明 
        // 0,初始化,XHR对象已经创建,还未执行open 
        // 1,载入,已经调用open方法,但是还没发送请求 
        // 2,载入完成,请求已经发送完成 
        // 3,交互,可以接收到部分数据  
        // status值说明 
        // 200:成功 
        // 404:没有发现文件、查询或URl 
        // 500:服务器产生内部错误 
        if (XHR.readyState == 4 && XHR.status == 200) { 
            // 这里可以对返回的内容做处理 
            // 一般会返回JSON或XML数据格式 
            console.log(XHR.responseText); 
            // 主动释放,JS本身也会回收的 
            XHR = null; 
        } 
    }; 
    XHR.send(); 
}

Jquery AjAxRédaction :

$.ajax({ 
        url:"servlet", 
        type:"post",//get 
        data:{}, 
        async:true, 
        cache:true, 
        complete:function(){}, 
        traditional:false, 
        dataType:"json", 
        success:function(data){}, 
        error:function(){} 
     });  
 $.post("servlet",{},function(data){},"json"); 
 $.get("servlet",function(data){},"json");

Cet article se termine ici (si vous voulez en voir plus, rendez-vous sur le site PHP chinois Utilisation d'AJAX (Étude dans la colonne du manuel). Si vous avez des questions, vous pouvez laisser un message ci-dessous.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn