articulo

Practicas básicas de Dom con javascript

Cuando la página termina de cargarse, en el navegador se genera una representación del sitio web en forma de árbol, al que suele llamarse Document Object Model, o de forma abreviada DOM. Esté permite a JavaScript acceder, recorrer, crear, reemplazar, editar y eliminar los elementos HTML que conforman la página, es una interfaz de programación estándar, esto quiere decir que está pensado como un medio de comunicación para acceder a los elementos que forman el sitio web.

El DOM se ve como un árbol en el que cada hoja o rama representa un elemento de HTML, la idea de representarlo como así, viene de buscar representar la jerarquía de los documentos, es decir, quiénes son hijos de quién, cuáles son hermanos, entro otros.

Se lista ahora una serie de prácticas que pretenden ayudar a familiarizarse con el uso del DOM.

  1. La empresa de desarollo web ha tenido a bien asignar la tarea a un programador Jr, de añadir un nodo hijo a un elemento, creando un nuevo nodo de elemento y añádirlo como hijo de un elemento existente en una página HTML. El detalle, es que el programador jr, no sabe como resolver esta consigna. Crea los archivos necesarios para poder ayudar al programador jr.
  2. En un foro de programación se ha publicado una duda que consiste en eliminar un nodo hijo de un elemento. Elimina un nodo hijo específico de un elemento existente en una página HTML. Aun no se ha resuelto. Crea los ficheros necesarios para poder resolver esta duda.
  3. En un hackaton, los creadores de páginas web han publicado la siguiente cuestión ¿cómo se puede cambiar el contenido de un nodo? En teoría solo se debe de seleccionar un nodo específico en una página HTML y cambiar su contenido usando el método .innerHTML. Crea los elementos necesarios que permitan resolver esta incógnita.
  4. Una empresa ha publicado un reto en un Diario, el que consiste en poder ocultar un elemento al hacer clic en un botón, puedes crear un botón en una página HTML y utilizar un evento de clic para ocultar un elemento específico al hacer clic en un botón. Crea los archivos necesarios que permitan resolver el reto.
  5. En un foro de javascript se ha publicado una pregunta que aún no se ha podido resolver, ¿cómo se puede mostrar un elemento al hacer clic en un botón? En teoría se puede crear un botón en una página HTML y utilizar un evento de clic para mostrar un elemento específico al pulsar sobre el botón. Crea los archivos que permitan resolver está cuestión.
  6. David, es un programador Jr. a quien le han encargado cambiar el atributo de un elemento, para ello se debe de seleccionar un elemento específico en la página HTML y cambiar uno de sus atributos (por ejemplo, la fuente de una imagen) utilizando el método .setAttribute(). Crea los archivos que sean. necesarios para ayudar a David.

Se espera que estos ejercicios puedan ayudar a comprender el manejo del DOM, con javascript.

Leave a Reply

Your email address will not be published. Required fields are marked *