Tutorial DOM de JavaScript con ejemplo

Tabla de contenido:

Anonim

¿Qué es DOM en JavaScript?

JavaScript puede acceder a todos los elementos de una página web haciendo uso del Modelo de objetos de documento (DOM). De hecho, el navegador web crea un DOM de la página web cuando se carga la página. El modelo DOM se crea como un árbol de objetos como este:

Cómo usar DOM y Eventos

Usando DOM, JavaScript puede realizar múltiples tareas. Puede crear nuevos elementos y atributos, cambiar los elementos y atributos existentes e incluso eliminar elementos y atributos existentes. JavaScript también puede reaccionar a eventos existentes y crear nuevos eventos en la página.

getElementById, innerHTML Ejemplo

  1. getElementById: Para acceder a elementos y atributos cuyo id está establecido.
  2. innerHTML: Para acceder al contenido de un elemento.

Pruebe este ejemplo usted mismo:

 DOM !!! 

Bienvenido


Este es el mensaje de bienvenida.



Tecnología


Esta es la sección de tecnología.

Ejemplo de controlador de eventos

  1. createElement: para crear un nuevo elemento
  2. removeChild: elimina un elemento
  3. Puede agregar un controlador de eventos a un elemento en particular como este:
 document.getElementById(id).onclick=function(){lines of code to be executed}

O

document.getElementById(id).addEventListener("click", functionname)

Pruebe este ejemplo usted mismo:

 DOM !!!