Introduction à Ajax avec Javascript et PHP

//On crée un objet XMLHttpRequest
    var ajax = new XMLHttpRequest();
     //On initialise notre requête avec open()
    
    ajax.onload = function(){
     if (ajax.status == 200){
         var reponse = ajax.response;
         document.getElementById('cadreAjax').innerHTML = reponse;
         console.log(reponse);
     } 
     else{
         console.log('Impossible de récupérer la demande Ajax !');
     }
   }
    var url = 'ajax'//url que vous souhaitez transmettre au serveur web. Ici on demande la page 'ajax'.
    ajax.open("GET", url, true);
    //On envoie la requête
    ajax.send();

Utilisation de la methode POST pour passer des données complexes

Vous pouvez passer des informations au serveur web sous forme de formulaire en indiquant la methode POST et en utilisant l'objet FormData() pour stocker vos informations.

var messageUser = document.getElementById('inputMessage');
var userId = document.getElementById('userId');
var myForm = new FormData();

myForm.append('message',messageUser.value);
myForm.append('userId',userId.value);

//On crée un objet XMLHttpRequest
    var ajax = new XMLHttpRequest();
     //On initialise notre requête avec open()
    var url = 'ajax'//url que vous souhaitez transmettre au serveur web. Ici on demande la page 'ajax'.
    ajax.open("POST", url, true);
    ajax.send(myForm);
    
    ajax.onload = function(){
         if (ajax.status == 200){
             var reponse = ajax.response;
             document.getElementById('cadreAjax').innerHTML = reponse;
             console.log(reponse);
         } 
         else{
             console.log('Impossible de récupérer la demande Ajax !');
         }
       }