javascript envoie les paramètres de requête ajax

JavaScript est l'un des langages de programmation les plus couramment utilisés sur Internet et peut être utilisé pour ajouter une interactivité dynamique aux sites Web. AJAX est une technologie d'échange de données asynchrone avec le serveur sans actualiser la page entière. Sur de nombreux sites Web, nous pouvons voir des exemples d’obtention de données via AJAX. Comment envoyer une requête AJAX et recevoir une valeur de retour en utilisant JavaScript ? Cet article vous le présentera.

Les principales étapes pour envoyer une requête AJAX comprennent :

1. Créer un objet XMLHttpRequest
2. Spécifier la méthode de requête et l'adresse de la requête # 🎜🎜## 🎜🎜#Définir les informations d'en-tête de la demande
3. Envoyer la demande
4. Recevoir et traiter les données renvoyées par le serveur
5. Créer un objet XMLHttpRequest#🎜 🎜##🎜 🎜#
Créez d'abord l'objet XMLHttpRequest via le code JavaScript.

6. var xhr = new XMLHttpRequest();

Spécifiez la méthode de demande et l'adresse de la demande

Ensuite, nous devons spécifier la méthode de demande et l'adresse de la demande. Par exemple, si nous devons utiliser la méthode GET pour envoyer une requête à /api/data.php, nous pouvons utiliser le code suivant.

2. xhr.open('GET', '/api/data.php', true);

Le premier paramètre spécifie la méthode de requête, le deuxième paramètre spécifie l'adresse de la requête et le troisième paramètre spécifie s'il faut s'exécuter de manière asynchrone, généralement vrai.

Si vous devez utiliser la méthode POST, vous pouvez utiliser le code suivant.

xhr.open('POST', '/api/data.php', true);

Définir les informations d'en-tête de demande

Avant d'envoyer la demande, nous devons également définir les informations d'en-tête de demande. Par exemple, vous pouvez définir le Content-Type sur application/x-www-form-urlencoded.

3. xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

Send request

Ensuite, nous pouvons utiliser la méthode send() pour envoyer la requête. Si vous utilisez la méthode GET, vous pouvez simplement transmettre une chaîne vide en tant que paramètre. Par exemple :

4. xhr.send('');

Si vous utilisez la méthode POST, vous pouvez transmettre les données qui doivent être envoyées. Par exemple :

xhr.send('name=John&age=25');

Recevoir et traiter les données renvoyées par le serveur

Lorsque le serveur renvoie une réponse, nous pouvons détecter l'état de la demande via l'attribut readyState. readyState a cinq valeurs possibles :

0 (non initialisé) : représente que l'objet xhr a été créé, mais que la méthode open() n'a pas été appelée.

1 (Envoi) : Indique que la méthode open() a été appelée, mais que la méthode send() n'a pas été appelée.

• 2 (Sent) : Indique que la méthode send() a été appelée, mais que le serveur n'a pas encore renvoyé de réponse.
• 3 (Réception) : Indique que la réponse a commencé à être reçue mais n'est pas terminée.
• 4 (Complet) : Indique que la réponse est terminée et que les données renvoyées par le serveur sont accessibles.
Nous pouvons utiliser le code suivant pour écouter les changements dans readyState.

• xhr.onreadystatechange = function() {
      if (xhr.readyState === 4 && xhr.status === 200) {
          // 处理服务器返回的数据
          console.log(xhr.responseText);
      }
  }

Lorsque readyState atteint 4, nous pouvons accéder à la propriété ResponseText pour obtenir les informations de réponse renvoyées par le serveur.

Ce qui précède sont les étapes de base pour envoyer des requêtes AJAX à l'aide de JavaScript. Avec ces étapes, nous pouvons facilement envoyer une requête asynchrone au serveur et obtenir les données de réponse.

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!