BananaMaster

31 - Gerador de Cartões de Produto, prática com loop for (Aulas JS)

Se esqueceu algo, clique para ir à aula

📘 Tarefa: Cartões de Produto

Construa um aplicativo "Cartões de Produto".

Após clicar no botão:

• Use um loop for para gerar 6 cartões de produto
• Exiba os cartões na página

📐 Cada cartão deve conter:

• Número do produto (h2)
• Preço (p)
• Um botão com o texto Comprar

📐 Estrutura HTML de cada cartão:

• Contêiner do cartão div class="card"
• Nome do produto h2 class="card-name"
• Preço do produto p class="card-price"
• Botão button com o texto Comprar

<div class="card"> 

    <h2 class="card-name">Produto 1</h2> 

    <p class="card-price">100$</p> 

    <button>Comprar</button> 

</div>

📐 Como funciona:

• Execute um loop for de 1 a 6
• A cada iteração, crie um novo cartão
• Insira o número do produto usando a variável do loop
• Adicione o cartão finalizado ao HTML

🧪 Exemplo:

📌 Importante:
A numeração dos produtos deve ser gerada pelo loop for. Não altere nada no HTML.