Necesito crear 4 articles mediante una función que los cree dentro de un section destino (display: grid) al cargar la página. Se trata de un desafío de la formación y no se me ocurre como. La función se ejecuta al ponerla en el body, pero, obviamente destruye toda la página dejando solo los artículos generados. Y el desafio consiste en que se mantenga la página web. Como nos encontramos en el módulo de evaluación de errores y tras llevar horas dándole vueltas no se si es posible o simplemente el maestro se está quedando con nosotros proponiendo un imposible.
Código HTML:
<section class="practice grid4-25">
<article onload="articulosDinamicos()"></article>
</section>
La función está metida en su correspondiente .js y funciona perfectamente, solo, que solo al colocarla en el body con onload o addEventListener. La section debería mantenerse ya que es una grid de 4 ya preparada para coger los artículos. El artículo del ejemplo puede desaparecer sin problemas.
Función JavaScript
function articulosDinamicos() {
for (let i=0; i < 4; i++) {
document.write('<article class="article-errores-javascript1"><h7 class="text-center margenb10">Artículo ' + (i+1) + '</h7><img src="assets/images/errores_javascript1-article.jpg"><div>Artículo creado de manera automática en la carga de la web.</div></article>');
}
¡Muchísimas gracias por adelantado!