Cómo hacer AJAX con PHP y HTML

Cuando el usuario hace clic en el botón que se muestra en esta página, el navegador se llama a la función JavaScript en la sección principal de la página.
2

Crear un objeto XMLHttpRequest . Agregue el siguiente código dentro de la función JavaScript:

var XMLHTTP if ( window.XMLHttpRequest ) { xmlhttp = new XMLHttpRequest (); } else { xmlhttp = new ActiveXObject ( " Microsoft.XMLHTTP ") ;}

Esto permite que la página web de manejar los diferentes navegadores .
3

Envíe su petición de datos a un script PHP. Agregue el siguiente código dentro de la función de JavaScript , dejando espacio para el código antes de que :

Xmlhttp.open ("GET ", " get_data.php ", true ) ; xmlHTTP.send ();

Esto indica al navegador que solicitar información adicional a la secuencia de comandos PHP especificado.
4

Crea tu script PHP. Abra un nuevo archivo en un editor de texto y guárdelo como " get_data.php " para que coincida con el parámetro al método de envío que utilizó en el código JavaScript . Escriba el siguiente código de ejemplo : < ? Phpecho " nuevos datos " ; >

Este es un sencillo ejemplo para la demostración , pero puede agregar cualquier proceso PHP que usted necesita, incluidas las consultas de base de datos . También puede construir su texto de respuesta en formato XML si este se adapte a su sitio.
5

Manipular la respuesta de su script PHP. En su función de JavaScript , antes de la línea en la que se abre el objeto XMLHttpRequest , agregue el siguiente código:

xmlHTTP.onreadystatechange = function ( ) { if ( xmlHTTP.readyState == 4 && xmlHTTP.status == 200 ) {//Procesar los datos de respuesta } }

JavaScript Cuando recibe una respuesta del script PHP , este código se ejecutará. El código comprueba que la respuesta es válida . Dentro de esta sentencia condicional , puede agregar código para escribir los nuevos datos en su página HTML.
6

actualizar el contenido de su página . En la sentencia condicional respuesta JavaScript , agregue el siguiente código: .

Document.getElementById ( "update ") innerHTML = xmlHTTP.responseText ;

Este código identifica el elemento div de la página y luego escribe el texto de la respuesta del código PHP en ella.
7

Guardar tus archivos y subirlos a su servidor. Vaya a la página y haga clic en el botón para comprobar que la función trabaja . Usted debe ver el contenido de la modificación elemento div .