¿Cuáles son las diferencias entre DOM y AJAX?

DOM y AJAX son dos cosas muy diferentes, pero generalmente van de la mano, por lo que describiría ambas y luego puede ver la diferencia fácilmente, también después incluiré un ejemplo de cómo se usan comúnmente estas dos.

DOM significa Modelo de objeto de documento. Básicamente, JavaScript carga la página HTML como una estructura de datos de árbol. Se utiliza para interactuar con el html, como agregar nuevos elementos, ocultar algo, etc.

AJAX significa JAVASCRIPT Y XML ASINCRÓNICO. Es una tecnología mediante la cual podemos obtener datos de un servidor sin hacer una recarga de página. Por ejemplo, Google obtiene resultados basados ​​en nuestra búsqueda sin hacer una recarga de página.

Te daré un ejemplo ahora.

Debes haber notado la increíble forma en que Fb carga nuevas publicaciones a medida que te desplazas por la página. Lo que sucede detrás de escena es usar Js que son:

  1. En su desplazamiento, verifique si ha llegado al final de la página
  2. En caso afirmativo, hacen una solicitud AJAX a su servidor pidiendo nuevas publicaciones.
  3. El servidor lo devuelve en forma de datos utilizables (como JSON) al cliente.
  4. Luego tomamos estos datos, hacemos la manipulación de cadenas en Js para formar contenido html.
  5. Luego hacemos MANIPULACIÓN DOM para agregar este contenido html a la página HTML que ve el usuario.

Así que espero que ahora esté claro cuál es la diferencia entre ellos …

DOM es lo que se procesa después de la compilación html en el navegador. Cuando inspeccione el elemento, verá los divs, la cabeza entre otras etiquetas. Estos constituyen DOM (Modelo de objeto de documento).

AJAX es una forma de obtener y configurar datos, que en los métodos de JavaScript, se utilizan para realizar solicitudes del servidor para obtener datos o publicar valores.

Espero que esto ayude.