Tuve la necesidad de agregar programáticamente una imagen al DOM , es decir a una página HTML, de forma dinámica.
Para ello, creé un img
elemento utilizando el createElement
método del objeto Documento:
const image = document.createElement('img')
Luego establezco el src
atributo de la imagen:
image.src = '/picture.png'
(Puedes utilizar una URL relativa o absoluta, tal como lo harías en una img
etiqueta HTML normal)
Luego identifiqué el contenedor al que quería agregar la imagen y llamé al appendChild()
método:
document.querySelector('.container').appendChild(image)
Tal vez te puede interesar:
- Cómo generar un número aleatorio entre dos números en JavaScript
- Cómo esperar el evento DOM listo en JavaScript simple
- Cómo determinar si una fecha es hoy en JavaScript
- Cómo contar el número de propiedades en un objeto JavaScript
Cómo agregar una imagen al DOM usando JavaScript
Tuve la necesidad de agregar programáticamente una imagen al DOM , es decir a una página HTML, de forma dinámica.
programar
es
https://aprendeprogramando.es/static/images/programar-como-agregar-una-imagen-al-dom-usando-javascript-2361-0.jpg
2024-10-21
Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente