Maison > Article > interface Web > Que fait l'ajax ?

Que fait l'ajax ?

青灯夜游original: 2022-01-17 16:41:509962parcourir

AJAX est une technologie permettant de créer des pages Web dynamiques et rapides. Elle peut être utilisée pour : 1. Effectuer des requêtes partielles pour obtenir une actualisation partielle (mettre à jour la page Web sans actualiser la page). 2. Demander des données au serveur une fois la page affichée ; chargé ; 3. Recevoir les données du serveur après le chargement de la page ; 4. Envoyer les données au serveur en arrière-plan.

Que fait l'ajax ?

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Qu'est-ce que l'Ajax ?

AJAX = JavaScript et XML asynchrones.

AJAX est une technologie utilisée pour créer des pages Web rapides et dynamiques.

AJAX permet aux pages Web d'être mises à jour de manière asynchrone en échangeant une petite quantité de données avec le serveur en arrière-plan. Cela signifie que certaines parties d'une page Web peuvent être mises à jour sans recharger la page entière.

Les pages Web traditionnelles (n'utilisant pas AJAX) doivent recharger la page entière si le contenu doit être mis à jour.

Il existe de nombreux exemples d'applications utilisant AJAX : Google Maps, Gmail, Youtube et Facebook. ? utilisé pour utiliser la transmission de données asynchrone (requête HTTP) entre le navigateur et le serveur pour effectuer des requêtes partielles afin d'obtenir une actualisation partielle

Que fait lajax ?

Que fait Ajax ? A quoi ça sert ?

1. Mettre à jour la page Web sans actualiser la page (actualisation partielle)

2. Demander des données au serveur après le chargement de la page

3. Recevoir les données du serveur après le chargement de la page

4. au serveur en arrière-plan

Comment utiliser Ajax ?

1. Créez un objet XMLHttpRequest

2. Utilisez la méthode open pour définir les informations d'interaction avec le serveur

3. Définissez requestHeader() request.setRequestHeader(attribute name, attributs value);

4. ) définissez les données envoyées, commencez à interagir avec le serveur

5. Obtenez la réponse, enregistrez l'événement

Exemple :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button onclick="getData()">获取数据</button>
    <script>
        function getData() {
            // 1.创建XMLHttpRequest对象
            var request = new XMLHttpRequest();
            // 2.使用open方法设置和服务器的交互信息
            // 请求的主体
            request.open(&#39;get&#39;, &#39;https://api.muxiaoguo.cn/api/lishijr/&#39;)
            // 3.设置requestHeader()    request.setRequestHeader(属性名称, 属性值);  
            // 这里用默认就好，不写了
            // 4. send()  设置发送的数据，开始和服务器端交互            
            request.send(); //调用send()之后,请求就会发送到服务器
            // 5.取得响应，注册事件
            request.onreadystatechange = function () {
                if (request.readyState === 4 && request.status === 200) { //4  响应完成 DONE
                    // console.log(request.responseText);
                    var res = JSON.parse(request.responseText);
                    console.log(res);
                    // 根据数据添加对应的节点
                    for (var arrIndex in res.data) {
                        // 创建一个节点
                        var p = document.createElement(&#39;p&#39;);
                        p.innerHTML = res.data[arrIndex].title;
                        document.body.appendChild(p);
                    }
                }
            }
            // 6.如果请求完成，并且响完成，可以获取到响应数据        

        }
    </script>
</body>
</html>

Résumé d'AJAX :

AJAX est du JavaScript et du XML asynchrones ; pour créer plus de technologie pour des applications Web plus rapides et plus interactives ;

AJAX est une technologie de navigateur indépendante du logiciel de serveur Web ;

AJAX n'est pas un nouveau langage de programmation, mais une technologie

AJAX utilise JavaScript pour envoyer et recevoir ; données entre le navigateur Web et le serveur Web (interaction front-end et back-end) ;

AJAX utilise le transfert de données asynchrone (requête HTTP) entre le navigateur et le serveur Web.

【Recommandation de didacticiel connexe :

Tutoriel vidéo AJAX

】

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!

JavaScript ajax xml 对象事件异步 http

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

Article précédent：Comment changer la requête ajax d'asynchrone en synchroneArticle suivant：Comment changer la requête ajax d'asynchrone en synchrone

Articles Liés

Voir plus