Introduction à AJAX

Introduction à AJAX

AJAX mis à jour des parties d'une page web, sans rechargement de la page entière.

Ce que vous devriez savoir déjà

Avant de continuer, vous devriez avoir une compréhension de base des éléments suivants :

• HTML / XHTML
• CSS
• JavaScript

Si vous souhaitez étudier ces sujets tout d'abord, trouver les tutoriaux sur notre page d'accueil.

Ce qui est AJAX ?

AJAX = Asynchronous JavaScript and XML.

AJAX est une technique permettant de créer des pages web rapide et dynamique.

AJAX permet aux pages web mises à jour un échange de petites quantités de données avec le serveur dans les coulisses. Cela signifie qu'il est possible de mettre à jour certaines parties d'une page web, sans recharger  la page entière.

Pages web classique, (qui n'utilisent pas AJAX) doit recharger la page entière si  le contenu  ou une partie du contenu doit changer.

Exemples d'applications utilisant AJAX : onglets Google Maps, Gmail, Youtube et Facebook.

Comment fonctionne AJAX

Les évènements sont les actions de l'utilisateur, qui provoquent l'appel des fonctions associées aux éléments de la page.
L'interaction avec l'utilisateur se fait à partir des formulaires ou boutons html.
Ces fonctions JavaScript identifient les éléments de la page grâce au DOM et communiquent avec le serveur par l'objet XMLHttpRequest.
Pour recueillir des informations sur le serveur cet objet dispose de deux méthodes:

• open: établit une connexion.
• send: envoie une requête au serveur.

Les données fournies par le serveur seront récupérées dans les champs de l'objet XMLHttpRequest:

• responseXml pour un fichier XML ou
• responseText pour un fichier de texte bru.

Noter qu'il faut créer un nouvel objet XMLHttpRequest, pour chaque fichier que vous voulez charger.

Il faut attendre la disponibilité des données, et l'état est donné par l'attribut readyState de XMLHttpRequest.

AJAX est basée sur les normes de l'Internet

AJAX est basée sur les normes de l'Internet et utilise une combinaison de :

• Objet XMLHttpRequest (pour échanger des données de manière asynchrone avec un serveur)
• JavaScript (pour afficher et interagir avec l'information)
• CSS (pour les données de style)
• XML (peut être utilisé comme format de transfert de données)
• PHP ou un autre langage de scripts peut être utilisé coté serveur.

Les applications AJAX sont indépendants du navigateur et de la plate-forme !

Google suggest

AJAX a été rendu populaire en 2005 par Google, avec Google Suggest.

google Suggest utilise AJAX pour créer une interface web très
dynamique :
lorsque vous commencez à taper des lettres dans la zone de recherche de Google, un JavaScript envoie des lettres à un serveur et le serveur retourne une liste de suggestions.

Commencer à utiliser AJAX aujourd'hui

AJAX est basée sur les normes existantes. Ces normes ont été utilisées par les développeurs depuis plusieurs années.

Lisez nos prochaines sections pour voir comment cela fonctionne !