Maison  >  Article  >  interface Web  >  Introduction à ajax et tutoriel sur l'écriture d'ajax natif en JS

Introduction à ajax et tutoriel sur l'écriture d'ajax natif en JS

PHP中文网
PHP中文网original
2017-06-21 11:08:581161parcourir

ajax

1. Qu'est-ce qu'ajax
Le nom complet d'ajax est Asynchronous JavaScript and XML, où Asynchronous signifie asynchrone, faisant référence à JavaScript et XML asynchrones.
 AJAX est une technologie permettant de créer des pages Web rapides et dynamiques. AJAX permet aux pages Web de se mettre à jour de manière asynchrone en échangeant de petites quantités de données avec le serveur en arrière-plan. Cela signifie que certaines parties de la page peuvent être mises à jour sans recharger la page entière.
Pour les pages web traditionnelles (n'utilisant pas AJAX), si le contenu doit être mis à jour, la page web entière doit être rechargée.
2. Les technologies incluses dans ajax
Tout le monde sait qu'ajax n'est pas une nouvelle technologie, mais une combinaison de plusieurs technologies originales. Il est composé des technologies suivantes.
1. Utilisez CSS et XHTML pour exprimer.
2. Utilisez le modèle DOM pour l'interaction et l'affichage dynamique.
 3. Utilisez XMLHttpRequest pour communiquer de manière asynchrone avec le serveur.
4. Utilisez javascript pour vous lier et appeler.
Principe 4.ajax
Le principe d'Ajax est simplement d'envoyer une requête asynchrone au serveur via l'objet XmlHttpRequest, d'obtenir les données du serveur, puis d'utiliser javascript pour faire fonctionner le DOM et mettre à jour la page.
5. Implémentation de la requête ajax
1. Créer un objet XmlHttpRequest
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, code d'exécution du navigateur Safari
xmlhttp= new XMLHttpRequest();
  } else {
    // Code d'exécution du navigateur IE6, IE5
 xmlhttp=new ActiveXObject("Microsoft. 🎜> xmlhttp.open("GET","http://127.0.0.1 :8080",true);
3. Envoyer la demande

xmlhttp.send();
4. Attendre Le serveur renvoie le contenu et traite
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && =xmlhttp.responseText;
   }
  }


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