(Resumen) #Día 35 – ¿ Cómo crear elementos HTML e introducirlos en un contenedor con javascript ?
Saber crear elementos html es darle sentido y utilidad a lo que has aprendido de Javascript para crear de verdad una aplicacion web
¿Cómo se hace?
Principalmente, y sin frameworks, a través del metodo del objeto Document createElement( “Etiqueta del elemento”)
Ejemplo:
- //Guardando en variable un nuevo elemento html de tipo párrafo <p> </p>
- let libro = document.createElement("P")
- console.log(libro)
Recuerda que todo en javascript es un objeto, y la variable que acabamos de crear ahora es un objeto del Documento HTML
¿Cómo escribo el contenido que contendrá esa variable?
Para ello usaremos un atributo de nuestro objeto para escribir su contenido, el atributo innerHTML
¿Cómo llevo ese elemento html a un lugar especifico de mi aplicación web?
- Primero necesitas saber exactamente en que etiqueta de tu arbol html quieres agregar un nuevo elemento
- Segundo necesitas saber si va antes o despues del contenido de esa etiqueta HTML.
- Tercero coloca el contenido que creaste
Sabiendo esto, simplemente llegas a esa etiqueta a travès de javascript y “agregas un hijo” a esa etiqueta” , la forma màs comùn de agregar la etiqueta es a través del método .appendChild("")
Te comparto mi aprendizaje completo con ejemplo pràctico en heysoypaez como crear elementos html
Pero si te sobra está ok, cuentame en que te puedo ser ùtl, ¿Cómo van tus proyectos?